在分页，工具栏搜索或filter之后，使jqGrid多选选择保持不变

我有这个jqGrid 。 以下是我想要的行为：

1. 更改页面或进行搜索后，所选项目将保持选择（并向用户呈现）（工具栏或filter）

2. 选择全部选择按钮时，如果当前页面上没有选择任何项目，则会全部选择它们。 如果已经选择了某个项目，它将清除整个列表，无论是否在页面上。

3. 单击“发票打印”按钮时，它将使用已经创建的ID列表，或者创建已选择的所有IDS的列表，无论是否在当前显示中。

如果不支持filter，则可以接受，但是首选。

---

可以肯定的是，我对js知之甚少，但这里有一些我尝试过的成功并不大的事情：

1. 这个答案建议使用onSelectRow和onSelectAll，但我无法实现。 看到失败

2. 这看起来很有希望，但只会修复分页的事情。 所以＃1看起来像一个首选的路线。 问题＃2的pastebin

---

PS回到了解js很少。 在我的项目中，函数select_ids的警报和未显示的function确实有效，不确定为什么它没有在jsfiddle中显示警报。 所以很抱歉，它需要修理，布朗尼指出，但发布分叉修复。

grid.jqGrid({ datatype: "local", data: mydata, colNames:['Inv No','Date', 'Client', 'Amount','Tax','Total','Notes'], colModel:[ {name:'id',index:'id', key: true, width:70, sorttype:"int"}, {name:'invdate',index:'invdate', width:90, sorttype:"date"}, {name:'name',index:'name', width:100}, {name:'amount',index:'amount', width:80, align:"right",sorttype:"float"}, {name:'tax',index:'tax', width:80, align:"right",sorttype:"float"}, {name:'total',index:'total', width:80,align:"right",sorttype:"float"}, {name:'note',index:'note', width:150, sortable:false} ], search:true, pager:'#pager', jsonReader: {cell:""}, rowNum: 10, rowList: [5, 10, 20, 50], sortname: 'id', sortorder: 'asc', viewrecords: true, multiSort: true, multiselect: true, height: "100%", caption: "Invoice Print" }); grid.jqGrid('navGrid','#pager',{add:false,edit:false,del:false,search:true,refresh:true}, {},{},{},{multipleSearch:true, multipleGroup:true, showQuery: true}); grid.jqGrid('filterToolbar',{stringResult: true,searchOnEnter : false, defaultSearch:"cn"}); 

Answer 1

这是脚本。 onSelectAll和onSelectRow允许保存gridComplete恢复的状态

 $(function () { var selectedRows = {}; var agentsGrid = $('#agentsTbl'); agentsGrid.jqGrid({ height: 400, datatype: 'local', multiselect: true, ignoreCase: true, colNames: [ 'isn', 'Agent', 'Type', 'Country', 'Plan', 'Date To'], colModel: [ { name: 'isn', index: 'isn', hidden: true, key: true, align: 'center' }, { name: 'agentName', index: 'agentName', align: 'center', search: true, stype: 'text', searchoptions: { sopt: ['cn'] } }, { name: 'agentType', index: 'agentType', hidden: true }, { name: 'country', index: 'country', align: 'center', search: true, width: 100, fixed: true }, { name: 'scheme', index: 'scheme', align: 'center', search: true, stype: 'text', searchoptions: { sopt: ['cn'] } }, { name: 'dateTo', index: 'dateTo', align: 'center', search: false } ], grouping: true, groupingView: { groupField: ['agentType'], groupDataSorted: true, groupColumnShow: false }, // to save selection state onSelectAll: function (rowIds, status) { 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]]; } } }, onSelectRow: function (rowId, status, e) { if (status === false) { delete selectedRows[rowId]; } else { selectedRows[rowId] = status; } }, gridComplete: function () { for (var rowId in selectedRows) { agentsGrid.setSelection(rowId, true); } } });