bootstrap table 分页显示问题
发布时间:2020-12-17 20:48:17 所属栏目:安全 来源:网络整理
导读:1.bootstrap-table客户端分页 客户端分页 的数据源可以是后台服务器端传递过来(一次性获取,即获取所有你需要的数据),点击页码不再请求后台,利用页面缓存分页;cache : true,//是否使用缓存,默认为true $(‘#TableId‘ ).bootstrapTable({ url : ‘/adjustQ
1.bootstrap-table客户端分页 客户端分页的数据源可以是后台服务器端传递过来(一次性获取,即获取所有你需要的数据),点击页码不再请求后台,利用页面缓存分页;cache : true,//是否使用缓存,默认为true $(‘#TableId‘).bootstrapTable({ url : ‘/adjustQueryController/getOAbudgetList.json‘,//请求后台的URL(*) method: ‘GET‘,sidePagination : "client",//分页方式:client客户端分页,server服务端分页(*) pagination : true,//是否显示分页(*) queryParams : queryParams,//分页 pageSize : 10,//每页显示的记录数 pageNumber : 1,//当前第几页 pageList : [ 10,25,50,100 ],//记录数可选列表 responseHandler: function(data){ return data.rows; //约定rows },columns : [ {checkbox : true},{title: ‘调整类型‘,field: ‘adjustType‘,align: ‘center‘},{title: ‘申请日期‘,field: ‘applyDate‘,{title: ‘单据编号‘,field: ‘processCode‘,{title: ‘调整组织‘,field: ‘applyOrganization‘,{title: ‘调整部门‘,field: ‘applyDepartment‘,{title: ‘是否涉及人力‘,field: ‘flag‘,align: ‘center‘} ] }); @RequestMapping(value = "/getOAbudgetList",method = { RequestMethod.GET }) public String getOAbudgetList(HttpServletRequest request,HttpServletResponse response){ String processCode = request.getParameter("processCode"); String adjustType = request.getParameter("adjustType"); String adjOrg = request.getParameter("adjOrg"); String adjDepart = request.getParameter("adjDepart"); String adjSubject = request.getParameter("adjSubject"); List<Map<String,String>> pageList = oaAdjustQueryService.findPageList(processCode,adjustType,adjOrg,adjDepart,adjSubject); int total = pageList.size(); String jsonStr = JSONArray.fromObject(pageList).toString(); String jsonString="{"total":"+total+","rows":"+jsonStr+"}"; //约定rows return jsonString; } 2.bootstrap-table服务端分页 ?服务端分页的数据源是后台服务器端传递过来的,每点击一次页码,将page、size发送给后台查询,返回页面数据 method: ‘POST‘,contentType : "application/x-www-form-urlencoded", //必须有 sidePagination : "server",//分页方式:client客户端分页,server服务端分页(*) pagination : true,//是否显示分页(*) queryParams : queryParams,//分页 pageSize : 10,//每页显示的记录数 pageNumber : 1,//当前第几页 pageList : [ 10,//记录数可选列表 function queryParams(params) { var batchId=[[${batchId}]]; //thymeleaf 页面获取单个数据 var str = { "page" : this.pageNumber,"pageSize" : this.pageSize,//需要传递page、size "filter" : { "filters" : [{ "field" : "budgetBatchId","value" : batchId }] } }; var baseData = JSON.stringify(str); var param = { models : baseData } return param; } ------------------------ 学习链接: https://blog.csdn.net/mhmyqn/article/details/25561535 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |