Jquery jqgrid分页不工作
我有一个js文件,并将参数传递给webmethod,webmethod以json格式返回输出。仅显示第一页。大约有100条记录,仅显示20条记录。我需要在后续页面中显示其他记录。我试着加上 表后面的div标记类似于Jquery jqgrid分页不工作,jquery,jqgrid,Jquery,Jqgrid,我有一个js文件,并将参数传递给webmethod,webmethod以json格式返回输出。仅显示第一页。大约有100条记录,仅显示20条记录。我需要在后续页面中显示其他记录。我试着加上 表后面的div标记类似于 可能您没有定义选项,因此将使用默认值20。通常,如果您正确地实现了数据的服务器端分页,就不会有问题。如果不想在服务器端实现数据分页和过滤,可以向jqGrid添加loadonce:true选项。在这种情况下,数据类型选项将自动更改为“本地”,分页将在不与服务器进行额外通信的情况下完成。
可能您没有定义选项,因此将使用默认值20
。通常,如果您正确地实现了数据的服务器端分页,就不会有问题。如果不想在服务器端实现数据分页和过滤,可以向jqGrid添加loadonce:true
选项。在这种情况下,数据类型
选项将自动更改为“本地”
,分页将在不与服务器进行额外通信的情况下完成。除此之外,loadonce:true
允许您在一行中通过使用或实现数据过滤。您应该包含更多完整的JavaScript代码,展示如何使用jqGrid。嘿,感谢回复Oleg。我曾经尝试过loadonce:是的,显示了大约20行,然后又重复了一遍,如何避免重复?如果我将rownum设置为80,则在80条记录之后,这些记录开始重复。@user1341773:不客气!您应该将问题的文本(单击问题下方的“编辑”链接)附加到JavaScript中。如果不去看代码,就不能说代码中哪里有错误。您将找到如何格式化答案中插入的代码的详细说明。这真的很简单。您使用的测试数据中至少有一部分也是有用的(2-3行数据就足够了)。希望这有助于您理解。:)@user1341773:您没有写过使用TreeGreed而不是简单的jqGrid。您可以找到TreeGrid的局限性。限制之一是:不支持分页。如果你考虑实现细节,你会明白,如何实现TreeGrid的分页还不太清楚。在第二页上,您可能希望看到第一个显示项的父项及其父项。@user1341773:。。。因此,如果页面大小小于您需要显示的项目级别,则由于显示父项目,您将无法显示项目本身。像这样的问题还有很多。无论如何,jqGrid作为TreeGrid不支持分页。
$("#SearchForComp").jqGrid({
scroll: true,
treeGrid: true,
altRows: true,
treeGridModel: 'adjacency',
ExpandColumn: 'DISPLAY_NAME',
datatype: function (postdata) {
postdata.deptSeqNo = null;
postdata.searchString = $("#SearchForComp").val().trim();
$.ajax({
type: "POST",
url: 'Department.aspx/compsearch',
contentType: "application/json; charset=utf-8",
dataType: "json",
data: JSON.stringify(postdata),
complete: completeUserSearch
});
},
mtype: "POST",
colModel: [{ name: 'KEY_FIELD', index: 'KEY_FIELD', width: 1, hidden: true, key: true },
{ label: 'Department/Name', name: 'DISPLAY_NAME', index: 'DISPLAY_NAME', width: 200, resizable: false, sortable: false },
{ label: 'Telephone', name: 'DISPLAY_PHONE', index: 'DISPLAY_PHONE', width: 150, align: 'center', resizable: false, sortable: false },
{ label: 'Email', name: 'DISPLAY_EMAIL', index: 'DISPLAY_EMAIL', width: 225, align: 'center', resizable: false, sortable: false, formatter: 'email'}],
treeIcons: { plus: 'ui-icon-plus', minus: 'ui-icon-minus', leaf: 'ui-icon-radio-off' },
height: 'auto',
caption: "User Search",
treeReader: {
level_field: "TREE_LEVEL",
parent_id_field: "PARENT_ID",
leaf_field: "IS_LEAF",
expanded_field: "EXPANDED"
},
jsonReader: {
root: "Data",
page: "CurrentPage",
total: "TotalPages",
records: "TotalRecords",
repeatitems: false,
id: "0",
userdata: "UserData"
},
beforeSelectRow: function (id, e) { return false; },
});