easyui datagrid分页要点总结
easyui的datagird插件比较好用,也很方便。网上也有很多热的网友贴出了使用代码,但是很少有网友指出在使用过程应该注意的地方,让我实在搞不清分页应该怎么使用。我就说下使用分页功能中要注意的一个小地方。
1、首先你的html得有个table标签
<table id="tt" ></table>
在js页面加载代码中$(document).ready({})加入代码:
$('#tt').datagrid({
singleSelect:true, //True 就会只允许选中一行。
fitColumns:true, //True 就会自动扩大或缩小列的尺寸以适应表格的宽度并且防止水平滚动。
url: 'dataTable.ashx?action=list', //数据请求地址
title: false, //不要标题
method:'get', //请求方式
loadMsg: '数据加载中请稍后……', //数据等待时候的提示
striped: true, //True 就把行条纹化。(即奇偶行使用不同背景色)
columns: [[ // field- 后台传来的json 键名,title-表头列名,...
{ field: 'Id', title: 'ID', width: 100, align: 'center' },
{ field: 'Name', title: '名字', width: 100, align: 'center' },
{ field: 'Description', title: '描述', width: 100, align: 'center' },
{ field: 'Price', title: '价格', width: 100, align: 'center' }
]],
pageNumber:1, //初始页码 默认 1
pageSize: 10, //每页显示的记录条数,默认为10
pageList: [5, 10], //可以设置每页记录条数的列表
pagination: true //设置true 才提供分布功能。
})
设置 pagination: true 后就有分页功能了,自动捕获翻页事件,自动重新请求。

如果只需分页功能,加入此段代码就可以了。
当点击翻页按钮时,会自动重新请求服务器并自动带上参数rows和page,后台获取这两个参数进行数据库查询数据即可。
获取数据后,把数据转换成json格式返回,列表就更新了。
注意:json中一定要有两个键名:total,rows
total:控件会根据total的值来判断有多少页,能不能翻页。
rows:控件会展示rows的数据集合。rows的值放的是 本页的某些条数据。
后台返回json例子:{"total":2,"rows":[{"Id":1,"Name":"步步高点读机","Description":"哪里不会点哪里工tttttt","Price":12.0},{"Id":3,"Name":"苹果手","Description":"吊丝专有,泡妞神气","Price":12.0}]}
就此分页功能实现。
easyui datagrid分页要点总结的更多相关文章
- EasyUI DataGrid分页数据绑定
记录东西感觉很痛苦,总结东西很痛苦,麻烦,不过为了下次的方便和知识的牢固以后要坚持总结. EasyUI DataGrid分页数据绑定 在解决方案中新建两个文件FormMain.aspx(html也可以 ...
- EasyUI datagrid 分页Json字符串格式
//EasyUI datagrid 分页Json字符串格式 //{"total":xx,"rows":[{...},{...}]} total:总数 rows: ...
- asp.net mvc easyui datagrid分页
提到 asp.net mvc 中的分页,很多是在用aspnetpager,和easyui datagrid结合的分页却不多,本文介绍的是利用easyui 中默认的分页控件,实现asp.net mvc分 ...
- easyUI datagrid 分页参数page和rows
Struts2获取easyUI datagrid 分页参数page和rows 用pageHelper分页时,只要是能够获取前台传来的两个参数page和rows基本就完成了很大一部分. 获取方法:定义两 ...
- EasyUI Datagrid 分页显示(客户端)
转自:https://blog.csdn.net/metal1/article/details/17536185 EasyUI Datagrid 分页显示(客户端) By ZYZ 在使用JQuery ...
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(8)-MVC与EasyUI DataGrid 分页
系列目录 前言 为了符合后面更新后的重构系统,文章于2016-11-1日重写 EasyUI Datagrid在加载的时候会提交一些分页的信息到后台,我们需要根据这些信息来进行数据分页再次返回到前台 实 ...
- easyui datagrid 分页略解
easyui datagrid 本身自带了分页功能. 但是这个需要你自己控制. 在后台可以得到两个datagrid的参数,rows 和page.其中rows是每页要显示的个数,page是第几页.单纯的 ...
- jquery easyui datagrid 分页详解
由于项目原因,用了jquery easyui 感觉界面不错,皮肤样式少点,可是官网最近打不开了,资料比较少,给的demo没有想要的效果,今天在用datagrid 做分页显示的时候,折腾了半天,网上的资 ...
- easyui datagrid分页
datagrid分页设置 pagination="true" 貌似是不行的! 只是显示分页工具栏 没有达到分页效果 前端 $(function (){ var p = $('#d ...
随机推荐
- net发送邮件
对于.NET而言,从2.0开始,发邮件已经是一件非常easy 的事了.下面我给出一个用C#群发邮件的实例,做了比较详细的注解,希望对有需要的朋友有所help.看了这篇BLOG,如果你还不会用.NET发 ...
- Java中static静态关键字的使用
我们可以基于一个类创建多个对象,每个对象都拥有自己的成员,所有成员变量的值是根据对象而存在的,有些时候我们希望一个类的所有对象共享一个成员,这就用到了static静态关键字 被静态关键字修饰的成员属于 ...
- Java for LeetCode 190 Reverse Bits
Reverse bits of a given 32 bits unsigned integer. For example, given input 43261596 (represented in ...
- DFS:Curling 2.0(POJ 3009)
冰壶2.0 题目大意:就是给你一个冰壶和一个地图,地图上有石头,冰壶只能沿着x方向和y方向运动,并且要一直运动直到撞到石头为止,并且沿着此方向撞过来会把挡住的石头撞没,冰壶在停的时候可以扔出去一次 ...
- Bootstrap分页插件:bootstrap-paginator
今天和大家分享一个Bootstrap的分页插件:bootstrap-paginator. 插件地址: https://github.com/lyonlai/bootstrap-paginator 先看 ...
- 使用apktool工具遇到could not decode arsc file的解决办法
问题详情: 当前环境为 win7 64位 jdk1.7 apktool.jar(版本1.5.2) apktool(版本windows-r05-ibot) 使用的反编译工具和apk文件为 反编译 ...
- delete 类对象指针的注意事项]
http://blog.csdn.net/infoworld/article/details/45560219 场景:1. C++类有构造和析构函数,析构函数是在类对象被delete时(或局部变量自动 ...
- solr使用
到网站上面下载solr http://archive.apache.org/dist/lucene/solr/4.7.2/ 链接: http://archive.apache.org/dist/luc ...
- Windows环境下Sybase12.5 图文安装教程
先准备好安装文件,解压缩ASE install.rar文件,文件夹中包含一个setup.exe可执行文件,双击运行 --- > 欢迎界面出现 下面选择相应国家的协议,我们选择“中华人民共和国”, ...
- 建模算法(五)——图与网络
(一)图与网络的基本概念 一.无向图 含有的元素为顶点,弧和权重,但是没有方向 二.有向图 含有的元素为顶点,弧和权重,弧具有方向. 三.有限图.无限图 顶点和边有限就是有限图,否则就是无限图. 四. ...