layui的分页需要后台配合,这边我使用的是pagehelper

  @RequestMapping("findGoods")
private String findGoods(Integer cateId, String goodsName,Integer pageNum,Integer pageSize) {
JSONObject json = new JSONObject();
PageHelper.startPage(pageNum,pageSize);
List<Goods> goods;
if (cateId == null && StringUtils.isBlank(goodsName)) {
goods = goodsService.findGoods();
} else {
goods = goodsService.findGoods(cateId, goodsName);
}
PageInfo<Goods> personPageInfo = new PageInfo<>(goods);
json.put("code",0);
json.put("msg","");
json.put("count",personPageInfo.getTotal());
json.put("data",personPageInfo.getList());
return json.toString();
}

pageHelper 使用原理不在此赘述了,但是注意一点就是PageHelper.startPage(pageNum,pageSize);,这句代码要写在执行查询操作之前

layui本身会在table请求传递page 和Limite,但是如此一来我们在点击下一页是page 和limit还会是1和10 所以需要手动设置,而且后台需要返回必须返回count值,用来计算总条数

   table.render({
elem: '#goods-table',
url: "/Goods/findGoods?cateId=" + cateId + "&goodsName=" + name+"&pageNum="+pageNum+"&pageSize="+pageSize,
cellMinWidth: 80,
toolbar: '#barTop',
cols: [[
{type: 'checkbox', fixed: 'left'},
{field: 'goId', title: 'ID', sort: true, align: 'center'},
{field: 'goodsId', title: '产品编码', sort: true, align: 'center'},
{field: 'modelnum', title: '产品型号', align: 'center'},
{field: 'goodsName', title: '产品名称', align: 'center'},
{field: 'categoryName', title: '分类名称', align: 'center'},
{field: 'price', title: '展示价格', sort: true, align: 'center'},
{
field: 'isDefault', title: '是否默认', sort: true, align: 'center', templet: function (d) {
return d.isDefault == 0 ? "否" : "是";
}
},
{fixed: 'right', title: "操作", align: 'center', toolbar: '#curd'}
]],
done: function (res) {
laypage.render({
elem: 'goods-page',
count: res['count'],
curr:pageNum,
limit: pageSize,
layout: ['prev', 'page', 'next', 'skip', 'count', 'limit'],
jump: function (obj, first) {
if (first) {
return;
}
initTable(obj.curr, obj.limit,cateId,name);
}
});
},
});

按照上面即可完成分页

最新文章

  1. 总结:客户端与服务器端使用正则增加URL参数的方法
  2. 第十二篇:SOUI的utilities模块为什么要用DLL编译?
  3. 【Eclipse】修改 编码格式
  4. UIMenuController 实现长按显示自定义菜单功能
  5. Probabilistic Graphical Models
  6. 超实用的JavaScript技巧及最佳实践(下)
  7. ASP.NET输出流至少要有256个字节的数据后Response.Flush方法才会生效
  8. LineNumberReader类的使用
  9. 【PHP】解决html网页乱码问题
  10. WCF 用netTcpbinding,basicHttpBinding 传输大文件
  11. ios创建的sqlite数据库文件如何从ios模拟器中导出
  12. StreamReader与StreamWriter
  13. SharePoint 更改管理帐户密码步骤
  14. day11.2lambda函数表达式 及其返回值注意事项
  15. 亲测实验,stm32待机模式和停机模式唤醒程序的区别,以及唤醒后程序入口
  16. Hadoop学习笔记(三):java操作Hadoop
  17. mysql中关于关联索引的问题——对a,b,c三个字段建立联合索引,那么查询时使用其中的2个作为查询条件,是否还会走索引?
  18. mfc editline 变为大框框
  19. VS2017编译boost库
  20. myEclips 中的项目复制重命名

热门文章

  1. 【文文殿下】CF1029F Multicolored Markers
  2. CF77E Martian Food(圆的反演or 笛卡尔定理+韦达定理)
  3. Drupal 远程命令执行漏洞(CVE-2018-7600)
  4. [Objective-C语言教程]类型定义:typedef(19)
  5. Dubbo自定义日志拦截器
  6. Welcome! This is the documentation for Python 3.6.8
  7. EDEM 2018 + Fluent 19.0耦合
  8. Cisco ASA 8.3前及8.3后版本Access-list 变化
  9. SpringMVC初写(四)上传和下载功能的实现
  10. Altium Designer安装孔周围放置圆形Polygon Pour Cutout