Question

I have a multiselect jqGrid with a multiselect grid-as-subgrid. In the onSelectRow event for the parent grid, how can I grab a reference to the child grid?

Essentially, I need to do the following:

1. Expand the subgrid (so as to load its data from the server)
2. Get a reference to that subgrid
3. With the reference, loop through the rows and set each one to selected (For rows which have a nested subgrid of their own, this will trigger their onSelectRow and repeat the process. Don’t worry, the grid is no more than 3 nestings deep.)

I’m looking through the various documentation this morning, but so far haven’t spotted what I need to make this happen. Maybe I’m just missing the obvious? Or maybe this would require a bit more cleverness?

I see how Step 3 above can be accomplished starting with getRowData() and looping through the results with setSelection(). I use those elsewhere in code and they work great. But Steps 1 and 2 above are where I’m stuck at the moment.

Edit: Following @Oleg’s answer below, I looked a bit more into synchronizing efforts between a parent grid’s onSelectRow event and subGridRowExpanded event. Here’s a boiled down version of what I’m testing right now:

onSelectRow: function(id, status) {
  // Automatically expand the sub-grid (to load the data) and select the rows in that grid
  autoSelecting = true; // autoSelecting is a global variable normally set to false
  $('#mainGrid').expandSubGridRow(id);
}
subGridRowExpanded: function(subgrid_id, row_id) {
  //... build the sub-grid, works fine (an artifact of which is a subgrid_table_id)
  // If this grid was auto-expanded to be auto-selected, select all its rows
  if (autoSelecting) {
    var sdata = $('#' + subgrid_table_id).getRowData();
    for (var i = 0; i < sdata.length; i++) {
      $('#' + subgrid_table_id).setSelection(sdata[i].Id);
    }
    autoSelecting = false;
  }
}

A few things are happening here as I tinker with this:

• If I’m stepping through FireBug to debug this, selections and sub-selections work correctly. However, if I take out breakpoints and try it in real-time, sub-selections don’t happen. The sub-grid expands, but its rows don’t get selected. I figure there’s a timing issue in there somewhere.
• I haven’t accounted for cascading de-selects yet, clearly.
• If the sub-grid is already expanded, the selecting doesn’t cascade.

Answer 1

Inside of loadComplete event handler the grid is loaded and you can do some additional actions like expanding of some rows.

• You can expand the subgrid with respect of expandSubGridRow method.
• To get the reference to the subgrid the subgrid should be created first. So the best place to reference of the grid is subGridRowExpanded event. You don’t posted the JavaScript code which you use, so it is difficult to describe all more exactly.
• To select all rows you can use setSelection in the loop or use code like $('.cbox', myGrid[0]).trigger('click'); There are different other variation how to do the same. If you will see that you have performance bottleneck here then I could describe how you can do the step more effective.

I can repeat, that the most important that you expand or select the rows after the grid data (or the subgrid data) is loaded.