easyui datagrid 前台分页
核心方法
//分页data
function pagerFilter(data, pagegrid) {
if (typeof data.length == 'number' && typeof data.splice == 'function') { // is array
data = {
total: data.length,
rows: data
}
}
var dg = pagegrid || $(this);
var opts = dg.datagrid('options');
var pager = dg.datagrid('getPager');
pager.pagination({
onSelectPage: function (pageNum, pageSize) {
opts.pageNumber = pageNum;
opts.pageSize = pageSize;
pager.pagination('refresh', {
pageNumber: pageNum,
pageSize: pageSize
});
dg.datagrid('loadData', data);
}
});
if (!data.originalRows) {
data.originalRows = (data.rows);
}
var start = (opts.pageNumber - 1) * parseInt(opts.pageSize);
var end = start + parseInt(opts.pageSize);
data.rows = (data.originalRows.slice(start, end));
return data;
}
调用方式
$(function(){
var $dg = $('#dg');
$dg.datagrid({
data: pagerFilter({ "total":1, "rows": [{"id":2}]},$dg),
loadFilter: pagerFilter,
pageSize: 10,
pageList: [10, 20, 50],
rownumbers: true,
idField: 'project_name',
resizable: true,
singleSelect: true,
pagination: true,
collapsed: false,
collapsible: true,
fitColumns: false,
nowrap: false
});
});
easyui datagrid 前台分页的更多相关文章
- 转easyui datagrid 前台分页的实现
easyui datagrid 前台分页的实现java采用的版本 来源:本站原创 js知识 超过5,090人围观 暂无评论 使用easyui分页,有后台服务器端实现和前台浏览器端实现.服务器端实现按规 ...
- JQuery easyUI DataGrid 创建复杂列表头(译)
» Create column groups in DataGrid The easyui DataGrid has ability to group columns, as the followin ...
- 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(8)-MVC与EasyUI DataGrid 分页
系列目录 前言 为了符合后面更新后的重构系统,文章于2016-11-1日重写 EasyUI Datagrid在加载的时候会提交一些分页的信息到后台,我们需要根据这些信息来进行数据分页再次返回到前台 实 ...
- 控制EasyUI DataGrid高度
这次要说的是控制EasyUI的高度,平时我公司的项目,用EasyUI较多,然后datagrid这个组件是用的非常多的.平时我们都是固定高度,常见代码如下: <table ...
- EasyUI datagrid 日期时间格式化
EasyUI datagrid中显示日期时间时,会显示为以下不太直观的数值: 添加以下JavaScript脚本,然后在field中添加 formatter: DateTimeFormatter 即可. ...
- easyui datagrid中 多表头方法总结
easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...
- jquery easyui datagrid翻页后再查询始终从第一页开始
在查询之前将datagrid的属性pageNumber重新设置为1 var opts = grid.datagrid('options'); opts.pageNumber = 1; easyui d ...
- 让easyui datagrid支持bootstrap的tooltip
让easyui datagrid支持bootstrap的tooltip 发表于 下午 1:53 by ylpro.net & 分类 Java. Easyui在1.3.3版本之前是不支持tool ...
- easyui datagrid 没数据时显示滚动条的解决方法
今天解决了一个bug,因为datagrid有多列,可是当没有数据的时候,后面的列无法通过滚动条拉动来显示,比较麻烦,而需求要求没有数据也要拉动滚动条查看后面有什么列,一开始在网上找了一些资料,发现都不 ...
随机推荐
- Centos7系统配置上的变化(一)
原文 Centos7系统配置上的变化(一) 安装后,一开始有点儿无力吐槽的感觉,变化这么大? 一.Runlevel 首先一条,原来一直用的CentOS-6.5-x86_64-minimal.iso光盘 ...
- java 科学计算库
stackoverflow 上的讨论, 其中不乏lib的作者... http://stackoverflow.com/questions/529457/performance-of-java-matr ...
- String.Split()功能
我们在过去的教训 String.Join功能(http://blog.csdn.net/zhvsby/archive/2008/11/28/3404704.aspx).当中用到了String.SPli ...
- SSIS从理论到实战,再到应用(2)----SSIS包的控制流
原文:SSIS从理论到实战,再到应用(2)----SSIS包的控制流 前文回顾: SSIS从理论到实战,再到应用(1)----创建自己的第一个包 上次说到创建了自己的第一个包,完成了简单的数据从数据库 ...
- DataTable转化为List
public List<T> ConvertToList<T>(DataTable dt) where T : new() { // 定义集 ...
- JAVA设计模式(09):结构化-代理模式(Proxy)
一,定义: 代理模式(Proxy):为其它对象提供一种代理以控制对这个对象的訪问. 二.其类图: 三,分类一:静态代理 1,介绍:也就是须要我们为目标对象编写一个代理对象,在编译期就生成了这个代理对 ...
- React.js终探(七)(完)
我们在前面介绍了组件的各种特性,这一节我们来说说多组件的情况. 在实际开发中,我们的组件难免会遇到有公共部分的情况,如果是个别情况还好,但如果数量比较多的话,那这时候,就需要公用了. 怎么公用呢? R ...
- jg-table 过程2 ( jgTable )
jg-table ( jgTable ) 添加一些新的功能,这是多行表头支持,要添加到,现在支持拖放多行表来改变头部的宽度, 假设设置cloneTheadToFoot 能够自己主动翻转多行表头,这也 ...
- 深入理解C指针之六:指针和结构体
原文:深入理解C指针之六:指针和结构体 C的结构体可以用来表示数据结构的元素,比如链表的节点,指针是把这些元素连接到一起的纽带. 结构体增强了数组等集合的实用性,每个结构体可以包含多个字段.如果不用结 ...
- EditPlus仿Sublime配色方案(三种任你选择)
[Options] Placement=2C00000002000000030000000083FFFF0083FFFFFFFFFFFFFFFFFFFFEA000000EE000000D6050000 ...