核心方法

//分页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 前台分页的更多相关文章

  1. 转easyui datagrid 前台分页的实现

    easyui datagrid 前台分页的实现java采用的版本 来源:本站原创 js知识 超过5,090人围观 暂无评论 使用easyui分页,有后台服务器端实现和前台浏览器端实现.服务器端实现按规 ...

  2. JQuery easyUI DataGrid 创建复杂列表头(译)

    » Create column groups in DataGrid The easyui DataGrid has ability to group columns, as the followin ...

  3. 构建ASP.NET MVC4+EF5+EasyUI+Unity2.x注入的后台管理系统(8)-MVC与EasyUI DataGrid 分页

    系列目录 前言 为了符合后面更新后的重构系统,文章于2016-11-1日重写 EasyUI Datagrid在加载的时候会提交一些分页的信息到后台,我们需要根据这些信息来进行数据分页再次返回到前台 实 ...

  4. 控制EasyUI DataGrid高度

    这次要说的是控制EasyUI的高度,平时我公司的项目,用EasyUI较多,然后datagrid这个组件是用的非常多的.平时我们都是固定高度,常见代码如下:             <table  ...

  5. EasyUI datagrid 日期时间格式化

    EasyUI datagrid中显示日期时间时,会显示为以下不太直观的数值: 添加以下JavaScript脚本,然后在field中添加 formatter: DateTimeFormatter 即可. ...

  6. easyui datagrid中 多表头方法总结

    easyui datagrid中怎么设置表头成多行显示呢?其实很简单,就是给datagrid的columns属性设置成多个数组就行了.下面直接看例子吧,这是一个两行表头的,按照此方法,还可以设置三行表 ...

  7. jquery easyui datagrid翻页后再查询始终从第一页开始

    在查询之前将datagrid的属性pageNumber重新设置为1 var opts = grid.datagrid('options'); opts.pageNumber = 1; easyui d ...

  8. 让easyui datagrid支持bootstrap的tooltip

    让easyui datagrid支持bootstrap的tooltip 发表于 下午 1:53 by ylpro.net & 分类 Java. Easyui在1.3.3版本之前是不支持tool ...

  9. easyui datagrid 没数据时显示滚动条的解决方法

    今天解决了一个bug,因为datagrid有多列,可是当没有数据的时候,后面的列无法通过滚动条拉动来显示,比较麻烦,而需求要求没有数据也要拉动滚动条查看后面有什么列,一开始在网上找了一些资料,发现都不 ...

随机推荐

  1. UVa 208 - Firetruck 回溯+剪枝 数据

    题意:构造出一张图,给出一个点,字典序输出所有从1到该点的路径. 裸搜会超时的题目,其实题目的数据特地设计得让图稠密但起点和终点却不相连,所以直接搜索过去会超时. 只要判断下起点和终点能不能相连就行了 ...

  2. Linux内核分析(五)----字符设备驱动实现

    原文:Linux内核分析(五)----字符设备驱动实现 Linux内核分析(五) 昨天我们对linux内核的子系统进行简单的认识,今天我们正式进入驱动的开发,我们今后的学习为了避免大家没有硬件的缺陷, ...

  3. OAuth和OpenID的区别(转)

    OAuth(开放授权)是一个开放标准,允许用户让第三方应用访问该用户在某一网站上存储的私密的资源(如照片,视频,联系人列表),而无需将用户名和密码提供给第三方应用.  OAuth协议为用户资源的授权提 ...

  4. webserver实现

    最近的工作需求client和server使用https协议进行通讯,我负责client编写程序,在操作系统的-depth理解认为一旦前webserver实现,整理代码: #include"a ...

  5. ORA-12638: 无法检索身份证明 解决的方法

    the NTS option makes the Oracle client attempt to use your current Windows domain credentials to aut ...

  6. Robot Framework自动化测试(一)---第一个脚本(转)

    最近工具中用Robot Framework框架来做自动化,所以,花时间学习了一下. =======所需环境=================== Python: https://www.python. ...

  7. 使用ExpandableListView时间轴效果达到

    不废话,首先在地图上,查看结果 这是用ExpandableListView来实现时间轴效果,原理比較简单,以月份为第一级,以天为第二级来实现的. package com.hj.main; import ...

  8. cocos2dx 解释二具体的启动过程:内存管理和回调

    在上一篇的第二部分中.我们有一句代码待解释的: // Draw the Scene void CCDirector::drawScene(void) { -...     //tick before ...

  9. 为什么解析 array_column不可用,

    不久前,自己在一个小项目,我要拿出每个元素的一维数组key的值,一维阵列的形成,突然想到php 有一种功能,实现. $array = array ( array ( "id" =& ...

  10. 阐述linux IPC(两):基于socket进程间通信(下一个)

    [版权声明:尊重原创.转载请保留源:blog.csdn.net/shallnet 要么 .../gentleliu,文章学习交流.请勿用于商业用途]     其中两个进程通信,有两个过程,以彼此的过程 ...