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有多列,可是当没有数据的时候,后面的列无法通过滚动条拉动来显示,比较麻烦,而需求要求没有数据也要拉动滚动条查看后面有什么列,一开始在网上找了一些资料,发现都不 ...
随机推荐
- C#中实现并发
C#中实现并发的几种方法的性能测试 0x00 起因 去年写的一个程序因为需要在局域网发送消息支持一些命令和简单数据的传输,所以写了一个C/S的通信模块.当时的做法很简单,服务端等待链接,有用户接入后开 ...
- Winpcap网络编程十之Winpcap实战,两台主机通过中间主机通信
注:源码等等的我不会全然公开的,此篇文章写出来为大家的网络编程或者课程设计提供一定的思路.. 好,本次我们须要完毕的任务是: 完毕两台主机通过中间主机的数据通信(网络层) 添加基于IP地址的转发功能 ...
- NSIS:迅雷5.8.6.600自由定制版脚本及下载
原文 NSIS:迅雷5.8.6.600自由定制版脚本及下载 虽然现在迅雷已升级到7.2版本,但作为一款下载工具,我们可能只是需要它的下载功能,所以,体积小资源占用也小的迅雷5便成了我们更好的选择.今天 ...
- Javascipt数组去重的几种方式
方法一 function unique(arr) { var retArr = []; for (var i = 0; i < arr.length; i++) { (retArr.indexO ...
- hdu2844 & poj1742 Coin ---多重背包--两种方法
意甲冠军:你有N种硬币,每个价格值A[i],每个号码C[i],要求. 在不超过M如果是,我们用这些硬币,有多少种付款的情况下,.那是,:1,2,3,4,5,....,M这么多的情况下,,你可以用你的硬 ...
- Yii Framework2.0开发教程(5)数据库mysql性能
继续<Yii Framework2.0开发教程(3)数据库mysql入门> 首先给予一定的尊重yii2数据库支持引进 Yii 基于 PHP's PDO一个成熟的数据库访问层的建立.它提供了 ...
- ASP.NET MVC+EF框架+EasyUI实现权限管理系列(12)-实现用户异步登录和T4模板
原文:ASP.NET MVC+EF框架+EasyUI实现权限管理系列(12)-实现用户异步登录和T4模板 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇) (1):框架搭建 ...
- oracle_连接数_查看
查看oracle数据库的连接数以及用户 .查询oracle的连接数 select count(*) from v$session; .查询oracle的并发连接数 select count(*) ...
- 线程同步synchronized
一Java规划共享多个线程之间数据的能力. 当线程以异步方式訪问共享数据时.有时候是不安全的或者不和逻辑的. 比方卖火车票.同一时刻一个线程在读取数据,另外一个线程在处理数据,当处理数据的线程没有等到 ...
- CSharp设计模式读书笔记(7):适配器模式(学习难度:★★☆☆☆,使用频率:★★★★☆)
适配器模式(Adapter Pattern):将一个接口转换成客户希望的另一个接口,使接口不兼容的那些类可以一起工作,其别名为包装器(Wrapper).适配器模式既可以作为类结构型模式,也可以作为对象 ...