grid.history: A New, Free Integration for jqGrid and jQuery BBQ
jqGrid is a JavaScript grid component with many useful features. I have previously explained how to use it with ASP.NET MVC.
jQuery BBQ is a library which helps you manage proper functionality of the web browser's back and forward buttons by changing the fragment (hash) of the URI. Using my integration means that you can have a jqGrid on a web page and the back and forward buttons will work as expected.
To be specific, when you first load a certain page, the grid will probably be on page 1. You could click the next page button on the grid to go to page 2. Without my integration, clicking the back button would not take you back to page 1. With my integration, it will. Similarly, I support the sort and records per page combo box. You can of course extend this yourself to track other grid features.
The image above shows a demo page I've prepared, which you try for yourself. The grid on the left does not use the history plug-in. The grid on the right does. Note that when you page, sort, or change the number of rows shown in the grid with the history, the URI fragment also changes.
I have contributed my plug-in back to the jqGrid project. You can get the source from github.
Comments
-
Saturday, 17 July 2010Don't work. Opera 10.60.3422
-
Wednesday, 21 July 2010
I think the line:
var newOptions = optionsWithHistory(options);
should be
var newOptions = optionsWithHistory.call(this, options);
because on my system, when the optionsWithHistory method is called, the "this" variable is the current window in the method and not the grid.
Good job by the way -
Tuesday, 17 August 2010
Hi, you're my held -)
I looked for a way to do this. I founded a way to persist this in cookies, but... then I had to reload the grid.
Now it goes very well... But do you have a way to add the server filter params ?
Thank you in advance,
Michel -
Tuesday, 17 August 2010
Craig,
Sorry if you didn't understand... (I'm french speaking -)
So, on the jqGrid demos (http://www.trirand.com/blog/jqgrid/jqgrid.html#), you have the integrated search toolbar as from version 3.5. This is the jqGrid filtertoolbar. Those params are given to the cfc (I work with coldfusion) with the 'other' parameters, page, rows... and take the parameter name from the colModel.
I tried with the persist.concat, but didn't succeeded (but i'm not a javascript guru -)
Thank you for your interest,
Michel -
Please login first in order for you to submit comments
- Page :
- 1
I hate to have to tell you, but when I looked at your demo page both grids did exactly the same thing when I "Next Page'd" four times then clicked "Back" in my browser...
... nothing.
Both grids stayed on Page 4. After I "Back'd" four times I backed off the grid page and back to the "Demo intro" page.
Browser: ChromePlus