Question

In jQuery there’s an option to set AJAX calls to be synchronous:

async: false

Is there a way to make this happen in the jqGrid plugin?

Taking a step back, the actual problem I’m trying to solve (and there may be a much better way to do this) is to add an “Expand All” button above a 3-level nested grid structure. My initial approach is simply this:

$('#buttonExpandAll').click(function() {
  // Get all the rows in the top grid
  var rows = $('#mainGrid').getRowData();

  for (var i = 0; i < rows.length; i++) {

    // Expand the sub-grid for this row
    $('#mainGrid').expandSubGridRow(rows[i].Id);

    // Get all the rows for the sub-grid
    //  NOTE: This isn't working because it the data hasn't asynchronously loaded yet
    var subrows = $('#mainGrid_' + rows[i].Id + '_t').getRowData();

    for (var j = 0; j < subrows.length; j++) {

      // Expand the sub-sub-grid for this sub-row
      $('#mainGrid_' + rows[i].Id + '_t').expandSubGridRow(subrows[j].Id);
    }
  }
});

As you can imagine, it expands the first level of nested tables just fine. However, the loop has already terminated before those nested tables get their data from their respective AJAX calls. So the inner loop has no records at the time it’s called.

Is there a clean way to “expand all” on a nested table structure in jqGrid? I realize that making all of the calls synchronous is a performance issue, but at least for now that’s probably not an issue, or at least may be the lesser of two evils.

Answer 1

There are many ajax calls in the jqGrid code. Almost every call has the corresponding ajax opetion which can be used to overwrite any ajax parameter. I suppose that ajaxSubgridOptions jqGrid option in the form

ajaxSubgridOptions: { async: false }

will solve your problem. If it will not help you can overwrite the setting for all ajax calls:

$.extend($.jgrid.ajaxOptions, { async: false });