java实现layui分页_layui如何实现数据分页功能
我们先来看下官网的演示画面。
具体代码:
页面引入layui.css、 layui.js
前台jsvar limitcount = 10;
var curnum = 1;
//列表查询方法
function productsearch(productGroupId,start,limitsize) {
layui.use(['table','laypage','laydate'], function(){
var table = layui.table,
laydate=layui.laydate,
laypage = layui.laypage;
table.render({
elem: '#layui_table_id'
, url: '/xx/pListQuery.html?pId='+productGroupId+'¤tPage='+ start+'¤tNumber=' + limitsize
/*, where:{pagename:start,pagelimit:limitsize} //传参*/
, cols: [[
{field: 'productId', title: 'ID', width: '170', sort: true}
, {field: 'productName', title: '名称', width: '450'}
, {field: 'productState', title: '状态', width: '100'}
, {field: 'effectTime', title: '生效时间', width: '120', sort: true}
, {field: 'invalidTime', title: '失效时间', width: '120', sort: true}
, {field: 'productCost', title: '成本', width: '100', sort: true}
, {field: 'poperation', title: '操作', width: '100',fixed: 'right', toolbar: '#barDemo'}
]]
, page: false
, height: 430
,done: function(res, curr, count){
//如果是异步请求数据方式,res即为你接口返回的信息。
//如果是直接赋值的方式,res即为:{data: [], count: 99} data为当前页数据、count为数据总长度
laypage.render({
elem:'laypage'
,count:count
,curr:curnum
,limit:limitcount
,layout: ['prev', 'page', 'next', 'skip','count','limit']
,jump:function (obj,first) {
if(!first){
curnum = obj.curr;
limitcount = obj.limit;
//console.log("curnum"+curnum);
//console.log("limitcount"+limitcount);
//layer.msg(curnum+"-"+limitcount);
productsearch(productGroupId,curnum,limitcount);
}
}
})
}
})
//监听工具条
table.on('tool(test)', function(obj){ //注:tool是工具条事件名,test是table原始容器的属性 lay-filter="对应的值"
var data = obj.data //获得当前行数据
,layEvent = obj.event; //获得 lay-event 对应的值
if(layEvent === 'detail'){
viewLableInfo(data.attrId);
layer.msg(data.attrId);
} else if(layEvent === 'del'){
layer.msg('删除');
} else if(layEvent === 'edit'){
layer.msg('编辑操作');
}
});
//常规用法
laydate.render({
elem: '#createDate'
});
//常规用法
laydate.render({
elem: '#processingTime'
});
});
}
var pId = '${pGBean.pgId }';
productsearch(pId, curnum, limitcount);
业务逻辑层@Override
public String queryList (HttpServletRequest request) {
String total = "";
String pId = request.getParameter("pId");
int currentNumber = Integer.parseInt(request.getParameter("currentNumber"));
String currentPage = request.getParameter("currentPage") == null ? "1" : request.getParameter("currentPage");
//分页处理,显示第一页的30条数据(默认值)
PageHelper.startPage(Integer.parseInt(currentPage), currentNumber);
List list = exportDao.queryList (pId);
if(list.size() > 0){
total = list.get(0).getTotal();
}
Page page = PageHelper.localPage.get();
if(page!=null){
page.setCurrentPage(Integer.parseInt(currentPage));
}
PageHelper.endPage();
JSONObject jsonObject = new JSONObject();
jsonObject.put("code", 0);
jsonObject.put("msg", "");
jsonObject.put("count", total);
jsonObject.put("data", list);
//System.out.println("json:----" + jsonObject.toString());
return jsonObject.toString();
}
sql
其中sql在计算总数totle时可以这么写COUNT(*) OVER(PARTITION BY 1) AS TOTAL
相关推荐:layui教程
java实现layui分页_layui如何实现数据分页功能相关推荐
- express ajax分页实例,DevExpress Navigator 数据分页 示例
[实例简介] DevExpress Navigator 示例,数据分页 [实例截图] [核心代码] /// /// 分页事件处理 /// /// 事件名称 /// 按钮控件 /// PengZhen ...
- MVC3学习第十三章 佟掌柜第二弹——MVC3下利用陕北吴旗娃的分页控件实现数据分页...
本章学习内容 1.了解陕北吴旗娃的Mvc分页控件 2.利用分页控件实现MVC3下的商品分页 3.利用分页控件实现MVC3下一个页面多个分页以及ajax分页效果 1.了解陕北吴旗娃的Mvc分页控件 在w ...
- mysql大量数据分页优化_mysql大量数据分页优化
一般我们数据量大的时候,然后就需要进行分页,一般分页语句就是limit offset,rows.这种分页数据量小的时候是没啥影响的,一旦数据量越来越大随着offset的变大,性能就会越来越差.下面我们 ...
- Mybatis-plugins分页助手实现查询数据分页
其他具体代码接上文->mybatis自定义处理器 1.导入坐标 <dependency><groupId>com.github.pagehelper</groupI ...
- 基于javaweb的房屋租赁管理系统(java+ssm+layui+mysql+jsp)
基于javaweb的房屋租赁管理系统(java+ssm+layui+mysql+jsp) 运行环境 Java≥8.MySQL≥5.7.Tomcat≥8 开发工具 eclipse/idea/myecli ...
- 数据分页 THINKPHP3.2 分页 三种分页方法
数据分页复制本页链接opensns 通常在数据查询后都会对数据集进行分页操作,ThinkPHP也提供了分页类来对数据分页提供支持. 下面是数据分页的两种示例.第一种:利用Page类和limit方法$U ...
- thinkphp [数据分页]
通常在数据查询后都会对数据集进行分页操作,ThinkPHP也提供了分页类来对数据分页提供支持. 我在最近的学习中也应用了thinkphp的分页操作,自己不是很会所以摘抄一些比较实用的代码与大家分享哦! ...
- dwz ajax分页,DWZ table的原生分页浅谈
最近在项目开发当中很少会用到DWZ原生的table分页,往往是使用jqgrid or grid这种第三方数据绑定的表格插件,如今在项目中要求了,就必须要使用DWZ自带的table了 接下来看一段代码, ...
- java实现layui分页_基于LayUI分页和LayUI laypage分页的使用示例
本文介绍了LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页,分享给大家,具体如下: 效果图: 一.引用js依赖 主要是jquery-1.11. ...
最新文章
- js修改display_Vue.js从零开始——过渡 / 动画效果(2)
- 什么是Zookeeper,Zookeeper的作用是什么,在Hadoop及hbase中具体作用是什么
- fopen参数mode详解
- opencv 采用 matplot 显示图片
- WebLogic11g-常用运维操作
- 【ArcGIS微课1000例】0005:空间连接(Spatial Join)
- 一般化机器学习与神经网络
- PHP超级全局变量总结
- 再次理解HTTP请求过程[概念原理篇]
- python matplotlib包图像配色方案
- Java高并发-多线程基础
- python龙卷风框架,龙卷风python的简单异步示例
- acwing 848 有向图的拓扑序列 拓扑序列
- 题目95:百鸡问题:一只公鸡值5元,一只母鸡值3元,而1元可买3只小鸡,用百元买百鸡。现有n元钱,想买n只鸡。问有多少种买法?(钱要用完)
- cv/dl/cl领域的实验室官网/牛人主页/技术论坛/比赛数据库/好玩的东西
- mysql 查询不等于问题
- 正则表达式的.*?不包含空格(解决办法)
- 选择性注意中的“salience map”的作用是什么?
- 树莓派4B 声音传感器DO模块
- bbpress 添加 featured image
热门文章
- Eclipse对类固醇的重构
- 如何分析线程转储– IBM VM
- 管理Jenkins作业配置
- 四位共阳极数码管显示函数_数码管模块.doc
- Linux 命令之 touch -- 创建文件
- 分析 Web 资源的访问过程(Servlet 程序访问过程)
- Spring Cloud Feign 请求压缩 、Feign的日志级别配置
- Java short 无符号右移_char类型byte类型或short类型进行无符号右移遇到的神奇问题...
- 程序代码移植和烧录需要注意什么_购买建站模板需要注意什么问题
- 深度学习pytorch--softmax回归(二)