I have remote binding, sorting, and paging set up. I click on a column header to sort and it calls my DataSourceUrl with the sort column included in the sortParams. Once sorted if I change the pageSize (standard grid drop down - no changes) the encoded url no longer has the sortParams for the sorted column. The UI still shows the sort but the data is no longer sorted because it was not sent to the server in the query.
Thanks,
Steve
Hi Dave,
Can you please open a new forum thread about your question? I believe it's relevant to this one, but returning the grid to its initial state is a bit tricky. It would definately be useful if you could provide me with an HTML sample where I can take a look at the script you are using :). However, here's what I can offer off the top of my head: 1. Manipulating the igGrid via its dataSource won't always update the igGrid's UI. Basically the dataSource takes care of the state of the data and the igGrid manipulates the dataSource. 2. Due to statement #1, you should always resolve to manipulating the igGrid (and its features)'s options instead of the internal dataSource. Thus, the approach I'd recommend is to capture the options of the igGrid like so: var cachedGridOptions = $("#Grid1").data("igGrid").options; These options also include the features attached to the grid and all of their options. For example you can access $("#Grid1").data("igGrid").options.features $("#Grid1").data("igGrid").options.features[0].name // let's assume that this is the paging feature $("#Grid1").data("igGrid").options.features[0].pageSize // yay! Finally, when you want to restore the igGrid to it's original state, I'd recommend doing it like so: $("#Grid1").igGrid("destroy"); $("#Grid1").igGrid(cachedGridOptions); Let me know if you have any problems or questions with this. Cheers! Borislav
Hi Steve,
I'm attaching a second sample - this time an MVC one.It uses the same approach, but demonstrates the igGrid bound to remote data (not necessarily OData).
Also, if you have problems opening the samples, please let me know.Just in case, here's the code I'm using - it's for the igGridPaging pageSizeChanging event: pageSizeChanging: function(evt, ui) {var remoteSortingExpressions = ui.owner.grid.dataSource.settings.sorting.expressions; var currentSortingColumnSettings = $(this).data("igGridSorting").options.columnSettings; if(remoteSortingExpressions.length > 0) { for(var i = 0; i < remoteSortingExpressions.length; i++) for(var j = 0; j < currentSortingColumnSettings.length; j++) { if(currentSortingColumnSettings[j].columnKey == remoteSortingExpressions[i].fieldName) $(this).data("igGridSorting").options.columnSettings[j].userSet_currentSortDirection = remoteSortingExpressions[i].dir; } ui.owner.grid.dataSource.settings.sorting.expressions = remoteSortingExpressions; ui.owner.grid.dataSource.settings.paging.pageSize = ui.newPageSize; ui.owner.grid.dataSource.dataBind(); return false; }
} Thank you for your patience!All the best,Borislav
I've received word from our developers that the page size change should have an equivalent effect to calling dataBind() - it removes all non-default feature settings (sorting, filtering and so on).
I've provided a workaround for the sort params in the sample I've attached to this reply.The sample itself contains 2 grid: one bound to local data and the 2nd - bound to OData - both of them are meant to serve as examples that the approach I've provided works fine for both local and remote data.Please have a look and let me know if it works for you.
We're trying to figure out how to restore the grid settings (page size, page index, sorting) when we return to the page via the Back button. We capture all the setting we want to preserve using window.unload and save them in cookies, and then read the cookies back in on window.load. Currently, we're using the datasource's urlParamsEncoded event (called when first binding the grid to the datasource) to try to put those settings into params.pagingParams and params.Sorting params. We can get the page size and page index to show up correctly, but the grid UI still shows page=1 and page size = 20 (the default we set), even though the grid is actually showing a different number of rows and a different page. So, the grid UI is out of sync with what's contained in the rows. Is there a way to manually set those GUI elements?
Also, I haven't been able to figure out how to set params.sortingParams so that the desired column is used for sorting in the desired dirction. Any suggestions?
(BTW, I'm checking the column settings on window.unload to find the current sort column and the direction. If the direction is ascending, the currentSortDirection property of the column is set to "ascending", not "asc" as some of the documentation indicates. This seems inconsistent with what params.sortingParams seems to be expecting--looking at it in the debugger makes me believe that it wants "asc" instead of "ascending". True?)
Dave
I'll provide you with a workaround for the 1st scenario: how to persist sorting after the page size has been changed.
It's currently crazy in here so I'll try to complete the sample till the end of the day.
Thanks for your patience!All the best,Borislav