Geek Answers Handbook

Remote jqGrid data, sorting locally

I have a grid for which I collect the entire data set, and then I want users to be able to sort the received data. I use the following attributes, but the grid does not sort. It is also worth mentioning that after the user clicks the button, I will make an AJAX call, then I will need to update from the source, but since I pull out all the data to the client every time, I do not need to go back to the server just for sorting.

loadonce: true, // to enable sorting on client side sortable: true //to enable sorting

Any suggestions are welcome!

+7
source share
4 answers

I'm not sure, but it seems to me that you want to achieve your sorting locally while your searches are deleted. I had the same requirement, and I did it as follows: Make the “search” remote and everything else (sorting, pagination, etc.) local in jqGrid

+2
source

I just noticed. You can use the loadComplete parameter when defining a grid.

  loadComplete: function() { // add a function here that waits for a short amount of time, like 100msecs jQuery("#list1").jqGrid('setGridParam', { datatype:'local', sortname:'name', sortorder:'asc', page:1 }).trigger("reloadGrid"); }

Please note that I use my data locally, and when I need an update, return the data type back to xml.

Important: this alone will not work: you should have a small amount of time to wait before running reloadGrid (line execution). Otherwise, you will not see the difference in output.

+3
source

It’s not too clear that the problem is what you could see, but when using a remote data source with local sorting and filtering, you need to pay attention to several things:

  • Even if you sort locally, you still need to remotely sort so that the downloaded remote data matches the current grid sort state.

  • You cannot change the loadonce value after loading the grid, but you can change the datatype value and force the server to restart. The grid will still have its starting url , which you set for the grid, so all you need to do is:

     $(this).jqGrid('setGridParam', {datatype:'json'}).trigger('reloadGrid');
  • You will lose choice when rebooting from a remote device, or even when locally sorting. To save them, you will need to add handlers that will save the selection, reload and then re-set these parameters.

More information on how to do this can be found here: http://articles.firstclown.us/post/jqgrid-configuration-for-remote-data-loading-with-local-sorting-and-filtering

+2
source

I need to update / upload deleted data, and all other operations are performed locally. Then this is how I can achieve my need.

Prepare jqGrid with local data type

 $("#jqGridView").jqGrid({ //url: originalUrl,// Original line //datatype: "json",// Original line datatype: "local", // For local sorting sortable: true, // I want local sorting for all columns colNames: [...], colModel: [...], //... });

Then call this function in (re) load / search:

 function reloadJqGrid() { var urlForSearch = "xxx"; // modify your search URL (if required) $.get(urlForSearch, function (data) { $("#jqGridView").jqGrid('setGridParam', { datatype: 'local', data: data.Payload //My URL response json is in JSend format, thus storing the array in "data.Payload". You may simply use "data" }) .trigger("reloadGrid"); }); }

Hope this help!

+1
source

More articles:


All Articles