MiniUI前台分页,假分页实现源码
背景
成都创新互联是一家专注于成都网站建设、做网站与策划设计,桦川网站建设哪家好?成都创新互联做网站,专注于网站建设十余年,网设计领域的专业建站公司;建站业务涵盖:桦川等地区。桦川做网站价格咨询:18982081108
对于数据较少,无需后台分页的需求,可使用以下解决方案
方案
MiniUI提供了监听事件,特别方便即可实现。
源码
mini.parse(); var grid = mini.get("datagridTable"); // 获取所有数据和总记录数 { total: 100, data: [...] } var dataResult = {}; dataResult.total = ret.length; dataResult.data = ret; // 监听分页前事件,阻止后自行设置当前数据和分页信息 grid.on("beforeload", function (e) { e.cancel = true; var pageIndex = e.data.pageIndex, pageSize = e.data.pageSize; fillData(pageIndex, pageSize, dataResult, grid); }); // 第一次设置 fillData(0, grid.getPageSize(), dataResult, grid); // 分页填充细节处理 function fillData(pageIndex, pageSize, dataResult, grid) { var data = dataResult.data, totalCount = dataResult.total; var arr = []; var start = pageIndex * pageSize, end = start + pageSize; for (var i = start, l = end; i < l; i++) { var record = data[i]; if (!record) continue; arr.push(record); } grid.setTotalCount(totalCount); grid.setPageIndex(pageIndex); grid.setPageSize(pageSize); grid.setData(arr); }
结束
以上代码,填充后台数组json即可完成前台分页。
分享题目:MiniUI前台分页,假分页实现源码
分享URL:http://scjbc.cn/article/ihcjoe.html