programmatically sorting the jqGrid

I have a jqGrid populated with data, but I want to change how this is shown by editing the CSS.

So far开发者_StackOverflow so good, but I'm trying to have a dropdownlist which, when changed, will sort the jqGrid based on the value selected.

Is there anyway to actually call the sort function programmatically?

I have tried the following which, does nothing:

$("#grid").jqGrid('setGridParam',{sortname: 'yearEdition,', sortorder: 'desc'});
$("#grid").trigger("reloadGrid");

Is there indeed a way to call this event?

You should use sortGrid method of jqGrid:

Sorts the given colname and shows the appropriate sort icon. The same (without sorting icon) can be done using setGridParam({sortname:'myname'}).trigger('reloadGrid'). If the reload is set to true, the grid reloads with the current page and sortorder settings.

try this

   $("#grid").jqGrid().setGridParam({sortname: 'yearEdition,', sortorder: 
'desc'}).trigger("reloadGrid");     

here is a SO question that might help jqGrid sorting on client side

As described by Oleg the following code will sort the grid by the yearEdition column, reload the grid and display the correct sorting icon:

$("#grid").jqGrid("sortGrid", "yearEdition", true);

If a descending sort order is required then the sortorder grid parameter must also be set e.g.

$("#grid").jqGrid()
    .setGridParam({sortorder: "desc"})
    .jqGrid("sortGrid", "yearEdition", true);

Note: As described in the API Documentation sortGrid is an Add On Grid method and will only be available if the correct download options were selected.