sahana
sahana

Reputation: 621

on clicking a button, clear jqgrid and reload data

I have a jqgrid which is not inside document.ready. It will be triggered only when I click a button.

  function getData{
    DataHandler.getTasks(locName,{callback:function(data){
    jQuery("#TaskTable").jqGrid(
                {
    datatype : "local",
    data : resultSet,
    height : 250,
    width : 960,
    sortable : false,
    ignoreCase : true,
    sortorder : "desc",
        //rest of the table contents like colname and colmodel
     });

    }, errorHandler:function(){

        },async:false

    });

I would like to clear the grid on every button click so as to remove the data already present and reload. Any help in doing this? Where should I give the clear grid inside document ready or on button click?

Thanks

Upvotes: 4

Views: 20651

Answers (2)

KevinIsNowOnline
KevinIsNowOnline

Reputation: 773

Assuming the markup of:

 <table id='myGrid' />

You can clear and load fresh data from the server by using the following code:

function loadTable() {
$('#myGrid').jqGrid('GridUnload');  //this does the work of clearing out the table content and loading fresh data
$('myGrid').jqGrid({
    url: 'url goes here',
    dataType: 'json',
    jsonReader: {
        root: 'Data',
        page: 'CurrentPage',
        total: 'TotalPage',
        records: 'TotalRecords',
        repeatitems: false
    },
    onSelectRow: editRow
});

}

You can also check the following link for more information.

Upvotes: 8

Mark
Mark

Reputation: 3123

So this can be done as part of the click event handler of the button

Reset the saved parameters from the last post in the jqGrid

var postData = grid.jqGrid('getGridParam', 'postData');
    $.extend(postData, { filters: "" });

Reset the search boxes that are filtering the results

 $('#gbox_SearchResults').find('[id^="gs"]').val('');

Trigger a reload

grid.jqGrid().trigger('reloadGrid', [{ page: 1}]);

Upvotes: 2

Related Questions