JqGrid - save selected flag

Question

Checking flags through pages in jqGrid erases the selected flags. So, if I checked some of the checkboxes on page 1, and then click "Next" to go to page 2, and then return to page 1, the selected checkboxes will no longer be checked.

Is there a way in jqgrid to handle this on the client side?

Answer 1

The first part of the answer contains the answer to your question. You can find a slightly improved version of the demo here .

If you don’t need to sort the demise multiselect column, do what you need. Some small notes about the demo: the checkbox above the "multiselect" column selects / deselects all rows only on the current page. If you want a different behavior, the code will be even simpler. I included a 3-item demo selection directly by loading the grid. The first page will display two elements and one element on the second page. In some situations, the behavior may be interesting. If you do not need this, you should just comment out the line idsOfSelectedRows = ["8", "9", "10"];

Below you will find the most important parts of the demo code.

 var $grid = $("#list"), idsOfSelectedRows = [], updateIdsOfSelectedRows = function (id, isSelected) { var index = $.inArray(id, idsOfSelectedRows); if (!isSelected && index >= 0) { idsOfSelectedRows.splice(index, 1); // remove id from the list } else if (index < 0) { idsOfSelectedRows.push(id); } }; // initialize selection idsOfSelectedRows = ["8", "9", "10"]; $grid.jqGrid({ datatype: 'local', // ... other parameters multiselect: true, onSelectRow: updateIdsOfSelectedRows, onSelectAll: function (aRowids, isSelected) { var i, count, id; for (i = 0, count = aRowids.length; i < count; i++) { id = aRowids[i]; updateIdsOfSelectedRows(id, isSelected); } }, loadComplete: function () { var $this = $(this), i, count; for (i = 0, count = idsOfSelectedRows.length; i < count; i++) { $this.jqGrid('setSelection', idsOfSelectedRows[i], false); } } }); 

If you want, you might consider holding idsOfSelectedRows as an optional jqGrid parameter. There is currently no jqGrid parameter validation, and you can extend them. The advantage would be to save idsOfSelectedRows along with the corresponding jqGrid.

UPDATED: The free jqGrid fork jqGrid supports the multiPageSelection: true option, which can be combined with the multiselect: true option. It allows you to hold the selarrrow parameter (a list of identifiers for selected rows) on many pages. By default, jqGrid reset the selarrrow array during swap, but if multiPageSelection: true, multiselect: true it does not reload. In addition, it pre-selects all rows from the selarrrow array during page assembly. Thus, if one fills the selarrrow array selarrrow all the columns of the elements (all rows across all pages), then the rows will be displayed selected. The user can still deselect some rows, and jqGrid will not change the changes made by the user.

The demo created for shows the use of multiPageSelection: true in the free jqGrid. Another answer will soon describe other new options for the free jqGrid: multiselectPosition: "right" , which allows you to move the multiselect checkbox column to the right, multiselectPosition: "none" , which allows you to use multiselect functionality without any multiselect column and hasMultiselectCheckBox callback, which not all jqGrid rows can be used to create multiselect flags.