bootstrap table

1、导入js与css

<!--导入js的方式有很多，按你们自己的来  我这里是用了thymeleaf模板-->
<link th:href="@{/static/bootstrap/dist/css/bootstrap.min.css}" rel="stylesheet">
<link th:href="@{/static/bootstrap-table/bootstrap-table.min.css}" rel="stylesheet">

<!-- Jquery-->
<script th:src="@{/static/jquery/jquery.min.js}"></script>
<!-- bootstrap-->
<script th:src="@{/static/bootstrap/dist/js/bootstrap.min.js}"></script>
<!-- bootstrap table -->
<script th:src="@{/static/bootstrap-table/bootstrap-table.min.js}"></script>
<script th:src="@{/static/bootstrap-table/bootstrap-table-zh-CN.js}"></script>

 2、js代码如下

    $('#table').bootstrapTable('destroy'); 
    $('#table').bootstrapTable({
	method : 'post',
    //get方法使用默认的application/json
	contentType : 'application/x-www-form-urlencoded',	
	url : '', // 路径
	queryParams : function(parms){ // 参数
        var parm = {
                // name : name
        }
        return parm
    },
	dataType: 'json',			// 返回数据类型
	locale:'zh-CN',				// 中文支持
	showRefresh: false,			// 刷新按钮
	showColumns: false,			// 显示列筛选
	//sidePagination: 'server',	// 设置在哪里进行分页，可选值为 'client' 或者 'server'
	uniqueId : '', 				// 绑定ID，对每一行指定唯一标识符
	cache : false, 				// 设置为 false，禁用 AJAX 数据缓存， 默认为true
	striped : false, 			// 表格显示条纹，默认为false
	pagination : true, 			// 在表格底部显示分页组件，默认false
	paginationLoop : true,		// 默认true，启用分页条无限循环的功能
	pageList : [ 20, 30, 40, 50 ],	// 设置页面可以显示的数据条数
	pageSize : 20, 				// 页面默认数据条数
	pageNumber : 1, 			// 首页页码
	search : false,				// 启动搜索框
	searchOnEnterKey : false,	// 默认false，输入自动搜索
	showHeader : true,			// 默认true
	showFooter : false,			// 默认false
	clickToSelect: false,		// 为true时点击行选中复选框
	toolbar : '',
    //showToggle:true，
	columns : [
		{ field : 'id', width : 100, align: 'center', title : 'id' },
		{ field : 'name', width : 100, align: 'center', title : '名称' },
		{ field : 'age', width : 150, align: 'center', title : '年龄' },
		{ field : 'six', width : 100, align: 'center', title : '性别' }
	],
	onLoadSuccess : function(data) {
		// 加载成功之后  
	}
});