【发布时间】:2016-09-26 13:03:43
【问题描述】:
我正在使用免费的 jqGrid。我希望能够在表上应用搜索过滤器,然后使用全选功能选择过滤结果中的行。然后如果过滤器被清除,仍然选择行。
这也需要在分页功能中起作用。
我已经按照question 中的答案进行了操作,不幸的是,这并没有给出所需的行为,因为“全选”只是选择当前页面上的行。
我需要用选定的行填充“selarrrow”,但如果我删除 multiPageSelection: true,此功能将停止工作。
请问我怎样才能实现上述目标?
这是我目前的代码:
$(function () {
var selectedRows = {};
$("#packageResults").jqGrid({
url: '@Url.Action("GetPackages", "Package", new { id = ViewBag.ProductOfferingId })',
datatype: "json",
colNames: ['Id', 'Name', 'Description'],
colModel: [
{ name: 'id', key: true, width: 55, sorttype: "int" },
{ name: 'name', width: 300, searchoptions: { "sopt": ["bw", "eq"] } },
{ name: 'description', width: 90 }
],
rowNum: 25,
rowList: [25, 50],
pager: true,
toppager: true,
sortname: 'id',
viewrecords: true,
guiStyle: "bootstrap",
search: true,
//height: "auto",
multiPageSelection: true,
multiselect: true,
caption: "Packages",
loadonce: true,
jsonReader: { repeatitems: false },
onSelectRow: function (rowId, status, e) {
if (status === false) {
delete selectedRows[rowId];
} else {
selectedRows[rowId] = status;
}
},
onSelectAll: function (rowIds, status) {
//apply select all to only those items in filter/search
if (status === true) {
for (var i = 0; i < rowIds.length; i++) {
selectedRows[rowIds[i]] = true;
}
} else {
for (var i = 0; i < rowIds.length; i++) {
delete selectedRows[rowIds[i]];
}
}
},
gridComplete: function () {
for (var rowId in selectedRows) {
$("#packageResults").setSelection(rowId, true);
}
}
});
$("#packageResults").jqGrid('navGrid',
{ edit: false, add: false, del: false, search: true, view: false, refresh: true },
{}, {}, {}, { multipleSearch: true, multipleGroup: true, showQuery: true });
$("#packageResults").jqGrid('filterToolbar', { stringResult: true, searchOnEnter: false, defaultSearch: "cn" });
});
提前致谢。
【问题讨论】:
-
在加载网格后,不清楚在哪里应用了一些 过滤器。你从哪里得到过滤器(它是静态的,你从服务器加载它,从
localStorage,...)。您应该使用forceClientSorting: true选项,它允许对从服务器加载的数据进行排序和过滤。请参阅the demo,它使用postData.filters应用过滤器和another one,它另外使用additionalProperties。 -
onSelectAll的行为对我来说不是很清楚。一个你用所需的值填充selarrrow,然后行将在更改页面时自动选择(因为multiPageSelection: true)。selarrrow数组将替换selectedRows。如果selarrrow/selectedRows中的所有可见(来自当前页面)行已被选中,那么您无需在onSelectAll或onSelectRow内执行任何操作。我不确定您要实现哪种行为。 -
@Oleg 用户负责在网格加载后应用过滤器。预期的行为是,网格加载,用户将过滤器应用于网格,用户单击“全选”选项,这应该只选择过滤的数据。实际的行为是当用户点击“全选”时,所有的数据行都被选中。请问如何实现预期的行为?
-
@Oleg 我使用您之前的演示创建了一个演示,希望能说明我的问题 - jsfiddle.net/ja2awqgL。在“Shipped via”列下,如果您按“FedEx”过滤,您应该在 2 页上有 7 个结果。如果您随后使用多选/全选选项,这将选择所有行,但我只想从过滤结果中选择 7 行。然后,如果我删除过滤器并应用不同的过滤器,我希望选择 7 行以及我选择的任何其他行。希望这可以澄清事情。谢谢。
标签: javascript jquery free-jqgrid