<table id="test-table" class="col-xs-12" data-toolbar="#toolbar">
function initTable(){
$('#test-table').bootstrapTable({
method: 'get',
toolbar: '#toolbar', //工具按钮用哪个容器
striped: true, //是否显示行间隔色
cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
pagination: true, //是否显示分页(*)
sortable: false, //是否启用排序
sortOrder: "asc", //排序方式
pageNumber:1, //初始化加载第一页,默认第一页
pageSize: 10, //每页的记录行数(*)
pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)
url: "${request.contextPath}/fdnRegTbl/listByPage",//这个接口需要处理bootstrap table传递的固定参数
queryParamsType:'', //默认值为 'limit' ,在默认情况下 传给服务端的参数为:offset,limit,sort
// 设置为 '' 在这种情况下传给服务器的参数为:pageSize,pageNumber
queryParams: queryParams,//前端调用服务时,会默认传递上边提到的参数,如果需要添加自定义参数,可以自定义一个函数返回请求参数
sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*)
//search: true, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大
strictSearch: true,
//showColumns: true, //是否显示所有的列
//showRefresh: true, //是否显示刷新按钮
minimumCountColumns: 2, //最少允许的列数
clickToSelect: true, //是否启用点击选中行
searchOnEnterKey: true,
columns: [{
field: 'id',
title: 'id',
align: 'center'
}, {
field: 'testkey',
title: '测试标识',
align: 'center'
}, {
field: 'testname',
title: '测试名字',
align: 'center'
},{
field: 'id',
title: '操作',
align: 'center',
formatter:function(value,row,index){
//通过formatter可以自定义列显示的内容
//value:当前field的值,即id
//row:当前行的数据
var a = '<a href="" >测试</a>';
}
}],
pagination:true
});
}
//请求服务数据时所传参数 function queryParams(params){ return{ //每页多少条数据 pageSize: params.pageSize, //请求第几页 pageNumber:params.pageNumber,
//自定义的参数 module:$('#module').val(), tblName:$('#tblName').val() } }
@RequestMapping(value="/listByPage",method = {RequestMethod.GET,RequestMethod.POST}) @ResponseBody public JSONObject listByPage(@RequestBody Map<String, String> param) throws Exception{ JSONObject jsonObject = new JSONObject(); Page page = new Page(); page.setPageSize(Integer.valueOf(param.get("pageSize"))); page.setCurrentPage(Integer.valueOf(param.get("pageNumber"))); Page pageData = getService().selectPage(XXX, page); jsonObject.put("rows",pageData.getResult()); jsonObject.put("total",pageData.getTotalCount()); return jsonObject; }
几点注意
1、queryParamsType默认值为'limit',不设置就是默认值。所以必须设置,可以是queryParamsType:''
2、根据queryParamsType值的不同,设置分页参数属性。queryParamsType的类型必须和分页参数名称匹配,否则取不到值