layui的分页
2024-09-25 17:11:07
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);
}
});
},
});
按照上面即可完成分页
最新文章
- 总结:客户端与服务器端使用正则增加URL参数的方法
- 第十二篇:SOUI的utilities模块为什么要用DLL编译?
- 【Eclipse】修改 编码格式
- UIMenuController 实现长按显示自定义菜单功能
- Probabilistic Graphical Models
- 超实用的JavaScript技巧及最佳实践(下)
- ASP.NET输出流至少要有256个字节的数据后Response.Flush方法才会生效
- LineNumberReader类的使用
- 【PHP】解决html网页乱码问题
- WCF 用netTcpbinding,basicHttpBinding 传输大文件
- ios创建的sqlite数据库文件如何从ios模拟器中导出
- StreamReader与StreamWriter
- SharePoint 更改管理帐户密码步骤
- day11.2lambda函数表达式 及其返回值注意事项
- 亲测实验,stm32待机模式和停机模式唤醒程序的区别,以及唤醒后程序入口
- Hadoop学习笔记(三):java操作Hadoop
- mysql中关于关联索引的问题——对a,b,c三个字段建立联合索引,那么查询时使用其中的2个作为查询条件,是否还会走索引?
- mfc editline 变为大框框
- VS2017编译boost库
- myEclips 中的项目复制重命名
热门文章
- 【文文殿下】CF1029F Multicolored Markers
- CF77E Martian Food(圆的反演or 笛卡尔定理+韦达定理)
- Drupal 远程命令执行漏洞(CVE-2018-7600)
- [Objective-C语言教程]类型定义:typedef(19)
- Dubbo自定义日志拦截器
- Welcome! This is the documentation for Python 3.6.8
- EDEM 2018 + Fluent 19.0耦合
- Cisco ASA 8.3前及8.3后版本Access-list 变化
- SpringMVC初写(四)上传和下载功能的实现
- Altium Designer安装孔周围放置圆形Polygon Pour Cutout