首先是bootstrap初始化的表格参数：
// 初始化Table oTableInit.Init = function() { $(‘#booksTable‘).bootstrapTable({ url : ‘/TestWeb/booksTable‘, // 请求后台的URL（*） method : ‘get‘, // 请求方式（*） toolbar : ‘#toolbar‘, // 工具按钮用哪个容器 striped : true, // 是否显示行间隔色 cache : false, // 是否使用缓存，默认为true，所以一般情况下需要设置一下这个属性（*） pagination : true, // 是否显示分页（*） sortable : false, // 是否启用排序 sortOrder : "asc", // 排序方式 queryParams : oTableInit.queryParams,// 传递参数（*） sidePagination : "server", // 分页方式：client客户端分页，server服务端分页（*） pageNumber : 1, // 初始化加载第一页，默认第一页 pageSize : 10, // 每页的记录行数（*） pageList : [ 10, 25, 50, 100 ], // 可供选择的每页的行数（*） search : false, // 是否显示表格搜索，此搜索是客户端搜索，不会进服务端，所以，个人感觉意义不大 strictSearch : false, showColumns : true, // 是否显示所有的列 showRefresh : true, // 是否显示刷新按钮 minimumCountColumns : 2, // 最少允许的列数 clickToSelect : true, // 是否启用点击选中行 height : 500, // 行高，如果没有设置height属性，表格自动根据记录条数觉得表格高度 uniqueId : "ID", // 每一行的唯一标识，一般为主键列 showToggle : true, // 是否显示详细视图和列表视图的切换按钮 cardView : false, // 是否显示详细视图 detailView : false, // 是否显示父子表 columns : [ { radio : true }, { field : ‘bookName‘, title : ‘书本名称‘ }, { field : ‘price‘, title : ‘书本价格‘ }, { field : ‘time‘, title : ‘书本入库时间‘ }, { field : ‘status‘, title : ‘是否借出‘ }, ] }); };
然后是前端要传给后端的参数：
oTableInit.queryParams = function(params) { /* var temp = { //这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的 limit : params.limit, //页面大小 offset : params.offset, //页码 bookName : $("#txt_search_bookName").val() }; */ if (!params) return { bookName : $("#txt_search_bookName").val() //bookName : "fuck" }; var temp = { // 这里的键的名字和控制器的变量名必须一直，这边改动，控制器也需要改成一样的 limit : params.limit, // 页面大小 offset : params.offset, // 页码 search : params.search, bookName : $("#txt_search_bookName").val() //bookName : "fuck you" }; return temp; };
这里的params是框架的table自动提供的，然后limit是页面大小，就是你一面显示多少行数据，也就是params会把你写的pageSize传过去。
然后这个offset是页码，比如说现在是第一页（limit=10），然后框架帮你传过去的的offset是0也就是从0开始，显示limit个数据，如果是第二页，offset是10，以此类推。
然后是后端的关键代码，server分页关键就是要告诉前端total几行，还有就是一页中的数据rows，rows数据是个json数组，里面每一个数据都是一个表格中行的json对象。看一下关键代码：
public Map<String,Object> getPageBase(){ int total=list.size();//list是dao层返回的所有数据的一个list Map<String,Object> result = new HashMap<String,Object>(); List<Object> lists = new ArrayList<Object>(); //判断总数是否大于页码的大小，大于则按照正常页码获取显示的数据，否则按照数据计算的页码，获取显示数据 if(total>offset){ for(int i=offset;i<total && i<(offset+limit);i++){ lists.add(list.get(i));//lists是要返回给前端的rows数组 } }else{ int nums=total/limit; for(int i=nums*limit;i<total;i++){ lists.add(list.get(i)); } } result.put("total",total); result.put("rows",lists); return result; }
