Programmatically select all rows in jqGrid?

Question

What is the best way to programmatically select all rows in jqGrid that is configured for multi-selection?

The code can cycle through all the lines in turn and select each, but then the checkbox in the grid header is not checked. I was only thinking of triggering an event with a row header with a header, but that would make assumptions about the underlying jqGrid implementation. There must be a better way ...

Thanks in advance!

Answer 1

If you select all rows in multiselect jqGrid by clicking on each of them manually, the checkbox in the header will not be checked, so I will not expect this to happen when you do it programmatically (if you use setSelected (rowid, true) for each lines, this is the equivalent of clicking on each of them, since the "true" parameter indicates that for each of them you need to fire the clicked event.)

Thus, if you want all of them to be checked, and you want the checkbox in the header to be checked, triggering the selected event may be the best choice. If you delve into the source code and see what happens when you click this checkbox, it actually just loops through all the lines and sets each as selected, so I don't think you will do much better.

Answer 2

I think nothing is impossible. This is an alternative solution. You can cycle through all the rows in turn and select each of them, then the checkbox in the grid header is checked manually. But the checkbox in the grid header is not selected if at least one checkbox is not selected.

colNames : [ ,'<input type="checkbox" id="cbox" onclick="UI_PaxCheckin.checkBox(this,event)" />',..] UI_PaxCheckin.checkBox = function(obj,e) { e = e||event; e.stopPropagation? e.stopPropagation() : e.cancelBubble = true; var grid = $('#jqGridPax'); if(obj.checked == true){ UI_PaxCheckin.multiSelectedFlightRowID = []; } for ( var p = 0; p < grid[0].rows.length -1 ; p++) { $('#chkIsSelected_' + p).prop('checked', obj.checked); //manual checkbox click event function call } $('#cbox').prop('checked', obj.checked);} 

Answer 3

Oddly enough, the API does not have such a function. Selecting the Select All check box programmatically will select the entire code (which you can find in the grid.base.js file, starting at line 1053. Unlike selecting individual lines manually, this will correctly trigger the onSelectAll event. So, yes, this makes assumptions but not as much as the other.: /

Answer 4

Yes, it’s true that this is not a very ordinary approach, and basically you said you thought you were doing it, but I found that it was the easiest way to get all the selected lines and also set the header checkbox:

  var grid = $("#my_grid"); grid.resetSelection(); $('#cb_my_grid').click(); var ids = grid.getDataIDs(); for (var i=0, il=ids.length; i < il; i++ ) grid.setSelection(ids[i], false); 

I believe that no rows will be selected if the header flag is programmatically pressed due to the underlying jqGrid implementation, as you said? I don’t know how it works below, but now it works for me from above.

The main reason I want to make sure the header checkbox is selected in my grids is because the user can subconsciously determine that yes, all the rows in the grid are definitely selected right now (including those not visible below the current scroll view), and don’t have to click on the title to see it.

@Craig - I need to try my method, it seems more simple and reasonable

Answer 5

Programmatically selecting the "Select All" check box DOES NOT ALWAYS trigger the selection of the entire code. We need to set the "checked" attribute earlier, so the correct branch for selecting the select method will be selected. Here is the code I used with the grid version 3.8.1:

 $("#cb_my_grid").attr("checked", true); $("#cb_my_grid").trigger('click'); $("#cb_my_grid").attr("checked", true); 

Answer 6

The best solution that actually clicks the “Select All” checkbox

 gridComplete: function(){ $(this).jqGrid('resetSelection'); $(this).closest(".ui-jqgrid").find(".ui-th-column:first .cbox").click(); } 

or if your grid id is "mygrid"

 $("#mygrid").jqGrid('resetSelection'); $("#cb_mygrid").click();