reload a loaded jqGrid with a different table data

Question

I have a page that displays a table in two different modes. In each mode I have a different set of columns. I'm using jqGrid to display the table. When I try to load the table for the second time (with same or different columns for that matter) the table will not refresh the data.

Is there a different API to reload data? Or should I use some method to clear the table first?

Answer 1

Found this answer. But this solves only half of the problem. When I try to reload with the new schema, it fails. Do I need to use two grids (one always hidden, toggle on mode change) to make this mode switch?

Answer 2

using the method "GridUnload" will unload the grid and leave the original HTML table. Next call to create the grid will start from scratch with any given schema

Answer 3

I ran into this same problem today. I use jqGrid to display search results from parameters specified in one or more form fields. I've got a click event on the search button and a keydown event on the fields themselves to capture the return key. Both events call a function that serializes the form and creates the initial jqGrid.

In the initial grid I have the option to call the function reloadEvents when the gridCompletes:

gridComplete: reloadEvents

In the reloadEvents function I have:

$("#frmSearch").bind("keydown", function(e) {
    if (e.keyCode == 13) {
     $('#searchList').setGridParam({url:'/model/actSearch.cfm?'+$('#frmSearch').serialize()});
     $('#searchList').trigger("reloadGrid");
    }
});

$('#btnSearch').click(function(){
    $('#searchList').setGridParam({url:'/model/actSearch.cfm?'+$('#frmSearch').serialize()}); 
    $('#searchList').trigger("reloadGrid");  
});

If you're loading your data in your grid a different way you can use setGridParam to change whatever you need. The reloadGrid method is what should refresh your data based on the params you change.