我们先来看下官网的演示画面。

具体代码:

页面引入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如何实现数据分页功能相关推荐

  1. express ajax分页实例,DevExpress Navigator 数据分页 示例

    [实例简介] DevExpress Navigator 示例,数据分页 [实例截图] [核心代码] /// /// 分页事件处理 /// /// 事件名称 /// 按钮控件 /// PengZhen ...

  2. MVC3学习第十三章 佟掌柜第二弹——MVC3下利用陕北吴旗娃的分页控件实现数据分页...

    本章学习内容 1.了解陕北吴旗娃的Mvc分页控件 2.利用分页控件实现MVC3下的商品分页 3.利用分页控件实现MVC3下一个页面多个分页以及ajax分页效果 1.了解陕北吴旗娃的Mvc分页控件 在w ...

  3. mysql大量数据分页优化_mysql大量数据分页优化

    一般我们数据量大的时候,然后就需要进行分页,一般分页语句就是limit offset,rows.这种分页数据量小的时候是没啥影响的,一旦数据量越来越大随着offset的变大,性能就会越来越差.下面我们 ...

  4. Mybatis-plugins分页助手实现查询数据分页

    其他具体代码接上文->mybatis自定义处理器 1.导入坐标 <dependency><groupId>com.github.pagehelper</groupI ...

  5. 基于javaweb的房屋租赁管理系统(java+ssm+layui+mysql+jsp)

    基于javaweb的房屋租赁管理系统(java+ssm+layui+mysql+jsp) 运行环境 Java≥8.MySQL≥5.7.Tomcat≥8 开发工具 eclipse/idea/myecli ...

  6. 数据分页 THINKPHP3.2 分页 三种分页方法

    数据分页复制本页链接opensns 通常在数据查询后都会对数据集进行分页操作,ThinkPHP也提供了分页类来对数据分页提供支持. 下面是数据分页的两种示例.第一种:利用Page类和limit方法$U ...

  7. thinkphp [数据分页]

    通常在数据查询后都会对数据集进行分页操作,ThinkPHP也提供了分页类来对数据分页提供支持. 我在最近的学习中也应用了thinkphp的分页操作,自己不是很会所以摘抄一些比较实用的代码与大家分享哦! ...

  8. dwz ajax分页,DWZ table的原生分页浅谈

    最近在项目开发当中很少会用到DWZ原生的table分页,往往是使用jqgrid or grid这种第三方数据绑定的表格插件,如今在项目中要求了,就必须要使用DWZ自带的table了 接下来看一段代码, ...

  9. java实现layui分页_基于LayUI分页和LayUI laypage分页的使用示例

    本文介绍了LayUI分页,LayUI动态分页,LayUI laypage分页,LayUI laypage刷新当前页,分享给大家,具体如下: 效果图: 一.引用js依赖 主要是jquery-1.11. ...

最新文章

  1. Spring基础专题——第五章(Aop代理)
  2. python测试框架untest怎么循环执行_Python自动化测试-Unittest单元测试框架详解
  3. Pixhawk之姿态控制篇
  4. 2017-5-17 分析文本
  5. oracle数据库主键自增序列_oracle数据库ID自增长--序列
  6. 计算机考研百天,2015考研计算机专业复习百天周计划
  7. 使用证书登陆Linux服务器
  8. 流水线冒险及解决方法
  9. Spring boot 日志框架
  10. 高性能mysql系统设计_MySQL 高性能表设计规范
  11. 中国地图里暗藏的天机
  12. mysql的 case用法_Mysql casewhen的三种用法
  13. OpenCV Python 椭圆 和 FDDB 数据库
  14. 光影mod_我的世界:mc十大“最受欢迎”mod,知道半数以上,实为老玩家
  15. vue项目中实现录屏两种方式rrweb和RecordRTC
  16. 获奖证书如何批量制作
  17. mysq coun(*)时为啥这么慢
  18. 动态联动select下拉框实现
  19. Mybatis ResultType处理返回类型
  20. 2.2加勒比海盗船 最优装载问题

热门文章

  1. OutOfMemoryError:无法创建新的本机线程–问题神秘化
  2. 休眠提示:排序和排序
  3. 用Jackson进行Java JSON处理
  4. HH SaaS电商系统管理后台的商品规格编辑
  5. 安装、启动、配置zookeeper(window版)
  6. nat 网卡间数据包转发_nat端口转发示例
  7. python代码可以内嵌在asp文件中_在IE中使用Python作为开发脚本(转)
  8. centos linux 内核升级,Centos系统的升级及Linux 内核升级
  9. linux系统io查看计算,Linux下查看进程IO工具iopp
  10. ios调用restful接口_做iOS上最好的REST API测试App