Jqgrid pager 关于“local” dataType 动态加载数据分页的研究（没好用的研究结果）

系列索引

Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引

Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数、ColModel API、事件及方法

Web jquery表格组件 JQGrid 的使用 - 5.Pager翻页、搜索、格式化、自定义按钮

Web jquery表格组件 JQGrid 的使用 - 6.准备工作 & Hello JQGrid

Web jquery表格组件 JQGrid 的使用 - 7.查询数据、编辑数据、删除数据

Web jquery表格组件 JQGrid 的使用 - 8.Pager、新增数据、查询、刷新、查看数据

Web jquery表格组件 JQGrid 的使用 - 全部代码

Web jquery表格组件 JQGrid 的使用 - 11.问题研究

JQGrid导出Excel文件

使用Jqgrid时突然发现 数据类型为local时，

datatype: 'local',
data:datas,
rowNum: 10,
rowList: [10],

指定data的datas长度大于rowNum时，pager点击下一页最后一页都是无效的

使用

$(grid)[0].addJSONData(jsongrid);

也一样无效。

搜索发现不少使用

http://stackoverflow.com/questions/5537728/jqgrid-pager-not-working-with-local-datatype

localReader或者jsonReader

但我测试无效

var grid = $('#table').jqGrid({
  datatype: 'local',
  altRows: true,
  colModel: [
    {name: '0', label: "Name"},
    {name: '1', label: "Color"},
  ],
  pager: "#pager",
  rowNum: 15,
  sortname: '0',
  viewrecords: true,
  gridview: true,
  height: '100%',
  autowidth: '100%'
});

var reader = {
  root: function(obj) { return results.rows; },
  page: function(obj) { return results.page; },
  total: function(obj) { return results.total; },
  records: function(obj) { return results.records; },

grid.setGridParam({data: results.rows, localReader: reader}).trigger('reloadGrid');

　　

My "results" is an object like this:

{page: "1", total: "70", records: "1045", rows:[.....]}

　　

jsonReader格式如下：

jQuery("#gridid").jqGrid({

... jsonReader :

{

root: "rows",  //数据模型

page: "page",//数据页码

total: "total",//数据总页码

records: "records",//数据总记录数

repeatitems: true,//如果设为false，则jqGrid在解析json时，会根据name(colmodel 指定的name)来搜索对应的数据元素（即可以json中元素可以不按顺序）

cell: "cell",//root 中row 行

id: "id",//唯一标识

userdata: "userdata",

subgrid: {

root:"rows", repeatitems: true, cell:"cell"

}

},

... });

示例json 数据格式;

 {

"total": "xxx", "page": "yyy", "records": "zzz",

"rows" : [

{"id" :"1", "cell" :["cell11", "cell12", "cell13"]},

{"id" :"2", "cell":["cell21", "cell22", "cell23"]},

... ]

}

　　

注意到加载json数据时

$(grid)[0].addJSONData(jsongrid);

是$(grid)[0]而不是$(grid)
推测[0]表示第一页，也就是数据全部加载到第一页了，但第一页数据数量受rowNum的限制

jqGrid获得所有行数据

var obj=$("#tablename").jqGrid("getRowData");

获取到的数据也是第一页的

建议解决办法：

1.使用后台返回的json数据，参考Web jquery表格组件 JQGrid 的使用 - 6.准备工作 & Hello JQGrid

url: "WebService/UserHandler.ashx",
 datatype: "json",

　

2.自定义数据分页

　在onPaging事件里处理 参考Web jquery表格组件 JQGrid 的使用 - 4.JQGrid参数、ColModel API、事件及方法 事件

未尝试，感觉比较麻烦

3.数据量不是太大时，本地数据一般数据量不会太大

rowNum: 1000,
rowList: [1000],

　　修改这两个不让翻页，改成拉滚动条吧

4.其他

欢迎高手给建议解决这个问题