jqGrid Refreshing Local Data (JSON Object)

Question

I\'m trying to use jqGrid with local data and I\'m finding a couple of issues:

I\'m initializing the thing like so:

function refreshGrid($grid, results)
         


        

Answer 1

I was able to achieve something similar. The trick for my issue was to clear out the data before updating the data grid parameter. Assuming your grid is initialized elsewhere (with datatype: 'local'), try:

function refreshGrid($grid, results) {
    $grid.jqGrid('clearGridData')
        .jqGrid('setGridParam', { data: results })
        .trigger('reloadGrid', [{ page: 1}]);
}

Answer 2

question 1:

If we have defined a pager for grid with client side data, the buttons in pager are automatically disabled. In other words, the current release of grid does not support client side paging and searching.

local data

Question 2: Have you tried:

 $("#list").GridUnload();

see here for the differences between gridUnload() and trigger('reloadGrid').

Answer 3

If you are using Local data, you should mention your Local json Data in jqGrid's setGridParam property

 jQuery("#list")
        .jqGrid('setGridParam', {
        datatype: 'local',
        data:results //json object
    });

To reload the jqgrid you can use the following.

 jQuery("#list").trigger("reloadGrid");

Answer 4

Following works for me when refreshing data on an existing grid:

var gridData = [...];

var grid = jQuery('#gridId');
grid.jqGrid('clearGridData');
if( grid.get(0).p.treeGrid ) {
    grid.get(0).addJSONData({
        total: 1,
        page: 1,
        records: gridData.length,
        rows: gridData
    });
}
else {
    grid.jqGrid('setGridParam', {
        datatype: 'local',
        data: gridData,
        rowNum: gridData.length
    });
}
grid.trigger('reloadGrid');

I had to do it this way because reloadGrid() calls populate(), populate() calls addLocalData() and passes the return value to addJSONData(), but for treeGrid == true, addLocalData() returns nothing, and addJSONData() subsequently does nothing.

Answer 5

I haven't found a good documented way to update jqGrid's local data, here is how I extended jqGrid to solve my problem:

$.extend($.fn.jqGrid, { setData: function(data) {
    this[0].p.data = data;
    return true;
} } );

After this you can do the following to update jqGrid with new data:

suppose your grid was declared like this:

    jQuery("#list").jqGrid({ datatype: "local", ... other params ... });

then you can do:

jQuery("#list").jqGrid('setData', array_with_new_data);
jQuery("#list").trigger("reloadGrid");

P.S. see the link on how to fetch all data from the grid Retrieving contents of the grid

Answer 6

You can use simple:

jQuery("#list")
    .jqGrid('setGridParam',
        { 
            datatype: 'local',
            data:mydata
        })
    .trigger("reloadGrid");