11

We use the jqGrid navigator reload button on a grid with loadonce set to true.

The reload button currently does NOT go back to the server to get the data - how can we get the reload to go to the server to get the latest data?

I believe we can use the beforeRefresh callback to set the grid data to json instead of local but I'm not clear how to even configure the beforeRefresh method - I don't really understand the docs.

Marcus Leon
  • 55,199
  • 118
  • 297
  • 429

2 Answers2

22

You are not the only person which has the problem. I answerd to the same question before. To reload the grid content from the server you should reset the datatype parameter to original value "json" or "xml" and then refresh the grid. For example

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

UPDATED: To call the line inside of beforeRefresh event handler you can do following

jQuery("#list").jqGrid('navGrid','#pager',
  { edit:false,view:false,add:false,del:false,search:false,
    beforeRefresh: function(){
        alert('In beforeRefresh');
        grid.jqGrid('setGridParam',{datatype:'json'}).trigger('reloadGrid');
    }
  });

I modified an example from am old question. Here if you click on the refresh button you can see live how the code work.

UPDATED 2: Free jqGrid supports some new options. reloadGrid event supports fromServer: true parameter which can be used to force reloading of data from the server and navGrid supports reloadGridOptions option which can be used to specify the options of reloadGrid used on click on Refresh button. So the above code could be

$("#list").jqGrid("navGrid", {
    edit: false,
    add: false,
    del: false,
    search: false,
    reloadGridOptions: { fromServer: true }
});

By the way one can use navOptions option of jqGrid to specify default options of navGrid (see the wiki article). It allows to write the code something like

$("#link").jqGrid({
    // all typical jqGrid parameters
    datatype: "json", // or "xml"
    loadonce: true,
    pager: true, // no empty div for page is required
    navOptions: {
        edit: false,
        add: false,
        del: false,
        search: false,
        reloadGridOptions: { fromServer: true }
    }
}).jqGrid("navGrid");
Community
  • 1
  • 1
Oleg
  • 220,925
  • 34
  • 403
  • 798
  • Thanks - How can you run this code when the reload button is clicked? I am not clear how to configure the nav bar to execute the `beforeRefresh` method if this is what you are alluding to. – Marcus Leon Sep 22 '10 at 19:08
  • @Marcus: If is very easy. I includes the corresponding code in my answer. – Oleg Sep 22 '10 at 21:03
  • @Oleg, I tried doing this, but once I click the refresh button, the pagination does not work. – Sukesh Kumar Jul 09 '12 at 18:02
  • @SukeshKumar: If you have problems with pagination you should probably reset `datatype` inside some other callbacks like `onPaging` for example (see [the answer](http://stackoverflow.com/a/9047197/315935) for an example). – Oleg Jul 09 '12 at 20:10
2

I have tried the following config and it works.

<script type="text/javascript">
jQuery(function() {
    jq("#YOUR-GRID-ID").jqGrid({
        ...
        loadonce: true,
        ...
    });
    jQuery("#refresh_YOUR-GRID-ID").click(function(){
        jQuery("#YOUR-GRID-ID").setGridParam({datatype: 'json'});
        jQuery("#YOUR-GRID-ID").trigger("reloadGrid");
    });
});
</script>
Lihong Wei
  • 21
  • 1