JqGrid setRowData method does not update hidden rows

Question

I use the jqGrid filterToolbar method so that users can quickly search / filter grid data. I use loadonce: true and datatype: local as my grid settings. I have a select filter for one of my columns that works fine.

The problem is that I am trying to update a line (using setRowData ) that is not visible (because the filter / search result hides them), the line is not updated when I look through them, clearing the filter.

Any suggestions? I tried to fire the reloadGrid event, no luck.

Greetings

Update 1 - Reproducing the issue:

Here's how to reproduce the problem using official jqGrid demos:

Step 1

Go to the jqGrid demo page and open the demo titled "Search Toolbar" in the "New in Version 3.7" section

Step 2

In the demo grid, filter the code column with a value of 575878 so that only the first row is displayed in the grid.

Step 3

Raise the javascript console and refresh the line that is currently not visible, in this example update line 2: jQuery("#toolbar").jqGrid('setRowData',2,{item_id:2,item:'blargh',item_cd:12345678});

Step 4

Display all lines by clearing the filter value and see that line 2 is not updated!

Anything I'm doing wrong here? Possible workarounds?

Answer 1

You misunderstand how a grid is built. A grid can contain hidden columns, but no hidden rows . If the body of the entire grid is deleted in one filter grid and only filtered rows are inserted.

The setRowData method can be used to change any grid line, but you cannot change something that is missing in the grid.

If you use a local grid ( datatype: 'local' ), then the data you save in the grid will be stored in the two internal parameters jqGrid data and _index . Therefore, you must modify the data object. To fill the grid with the modified data , you need to call .trigger("reloadGrid") .

So, if you want to change the item_id , item and item_cd of the grid data for rowid = 2, you can take the following steps.

1) Get links to jqGrid data and _index internal parameters:

 var $myGrid = jQuery("#toolbar"), data = $myGrid.jqGrid('getGridParam', 'data'), index = $myGrid.jqGrid('getGridParam', '_index'); 

2) Get a reference to the object that represents the required rowid:

 var rowId = '2', itemIndex = index[rowId], rowItem = data[itemIndex]; 

3) Change the data item as you need:

 rowItem.item_id = 2; rowItem.item = 'blargh'; rowItem.item_cd = 12345678; 

4) Refresh the grid (if necessary) by reloading the grid

 $myGrid.trigger('reloadGrid');