码迷,mamicode.com
首页 > Web开发 > 详细

jQuery EasyUI插件使用之datagrid的分页功能使用备忘

时间:2015-08-27 09:40:25      阅读:193      评论:0      收藏:0      [点我收藏+]

标签:

官网:  http://www.jeasyui.com/index.php

对照这官网提供的demo以及api文档,慢慢摸索学习
首先是其中的datagrid插件,其中的分页功能

客户端相关属性配置:
pagination     boolean 默认false  显示一个分页工具栏: true/false
pagePosition  string  默认bottom 分页工具栏的位置:  ‘top‘,‘bottom‘,‘both‘ (下图就是在底部)
pageNumber  number  默认1      页码:第1页、第2页(直观一点就是下图中,第二个红色框起来的页码)
pageSize         number  默认10     每页的记录数 (下图第一个红色框起来的每页记录数)
pageList          array   默认[10,20,30,40,50] 提供给用户可选择的每页显示记录数 (下图中第三个红色框起来的下拉列表)

技术分享

服务器端:
1、接收参数
page 接受客户端的页码,对应的就是用户选择或输入的pageNumber(按照上图的例子,用户点了下一页,传到服务器端就是2)
rows 接受客户端的每页记录数,对应的就是pageSize  (用户在下拉列表选择每页显示30条记录,传到服务器就是30)

php后台的代码参考(我也是不知道哪里copy来的):

点击(此处)折叠或打开

  1. $page = isset($_POST[‘page‘]) ? intval($_POST[‘page‘]) : 1;
  2. $rows = isset($_POST[‘rows‘]) ? intval($_POST[‘rows‘]) : 20;
如果数据库是mysql,计算一个偏移量:

点击(此处)折叠或打开

  1. $offset = ($page - 1 ) * $rows;
而sql语句最终是这样子的:

点击(此处)折叠或打开

  1. select * from TAB where xxx limit $offset, $rows
假设用户选择每页显示30条记录(rows)、要看第8页(page)
最后计算出偏移量= (8-1)*30=210

点击(此处)折叠或打开

  1. select * from TAB where xxx limit 210,30

2、返回json
total: 总的记录条数
rows:  本页的记录

其中rows就是刚才sql语句返回的记录
total是本次查询总的记录数(不止是本页)

点击(此处)折叠或打开

  1. select count(*) from TAB where xxx
最终返回客户端的可能是这个样子:

点击(此处)折叠或打开

  1. {
  2.    total: 1235,
  3.    rows: [
  4.       {id:332343, name:‘xxxxxx‘},
  5.       {id:342342, name:‘yyyyyy‘},
  6.       ......
  7.    ]
  8. }

jQuery EasyUI插件使用之datagrid的分页功能使用备忘

标签:

原文地址:http://my.oschina.net/baochanghong/blog/497685

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!