jqGrid caching the grid data

Question

I have a button onclick it should go to a another page containing jqGrid..but if user want to go and see the data it should be cached and show instead of making a call to the server.... form values were cache by default but jqGrid ...how to cache it?

Answer 1

Forms are part of the HTML spec, jqGrid is not... why would you expect the grid's data to be cached?

That said, if you use a GET url to retrieve data for the grid, certain browsers such as IE will cache the results of the GET. You will need to make the URL unique (for example, by appending a timestamp) in order to prevent data from being cached. Keep in mind, however, that this will not cache the data in all browsers.

Answer 2

The Caching of data can be realized but it is not easy. You have to define on the server side some HTTP headers based on the caching strategy choosed. For example you can use max-age of the "Cache-Control" HTTP header like

Cache-Control: max-age=60

which means, that the server response should be cached during 60 sec on the client. If you plan to use this you have to define additional parameter prmNames:{nd:null} of jqGrid, which will remove sending of nd parameter with the timestamp included in any server request. After doing this steps all ajax requests used by jqGrid will be get from the local cache during the time interval (60 sec).

The implementation of the server side caching with strategy more complex as a fixed caching time is possible with respect of ETags (Entity Tags). It is my favorite strategy, but its implementation is relatively complex (see Guidance on a better way to retain filtering options when using ASP.NET MVC 2 and Concurrency handling of Sql transactrion for details).

If the way with caching of data you will be not able to use (because of some reasons) I would recommend you as an alternative following two variants:

1. creating the grid on the same page as the buttons and other filters from the form which defines jqGrid parameters (see How to filter the jqGrid data NOT using the built in search/filter box).
2. "Repainting" the page with the form with respect of jQuery.Remove() or jQuery.Empty() and new ajax request. For example with jQuery("body").Empty() or jQuery("div#main").Empty() where <div id="main"> is somewhere on top of the body. Then you can fill the page body (or div with id="main") with the call like jQuery("body").load("newPage.htm") or jQuery("div#main").load("newPage.jsp").

The advantage of these alternatives is that you will stay on the same page and all JavaScript data can be used. You can for example get old jqGrid data from the 'data' parameter if your grid use "loadonce:true" parameter and then create new jqGrid using the data value as the 'data' parameter of the new jqGrid.