problems with jqxGrid 'ready' callback in IE8 only

[justin.mannParticipant]

First off…

Awesome work guys, this is a great library with highly intuitive tools and features. API is good as well, not many holes and I was implementing some irregular features, but your api caught a good portion of them making it pretty easy on me.

I am working on a project for a state gov. and was charged with updating an old grid and implement existing features… after some looking we landed on your product and the agency purchased a license (I am still working with the free version I first downloaded as I am still in dev cycle).

So The problem I am having is regarding use of the ready callback in IE8. I am using the callback to read sessionStorage and make certain feature states persist across page loads (yes I know you have thought about this and have built in functionality to save and restore the grid state… I won’t get into why I am not leveraging this functionality I will simply say it is not an option at the moment). Everything works wonderfully in IE9, IE10, Chrome and other modern browsers I am testing with… IE8 is simply not doing anything in the ready callback, I have used your api functionality to remove as much of this feature persistence from the ready callback as possible, but have reach a point I am simply out of options (that I can think of anyways). So I am getting in touch with you to hopefully get some advice and perhaps get a fresh perspective…

Following is a more detailed description of the features I am trying to make persist and how I am achieving this… I am doing a number of things I consider non-typical to achieve this so I hope it is not too confusing… I understand you have made great efforts to build some of this persistence in and it is not the case I am ignoring your efforts, I can only modify the front end and have other constraints as well… Please advise based on the following…

I am only interested in some insight as to why you think IE8 would not be responsive to the ready callback for the grid.

I am setting sessionStorage variables using jqWidgets Events and later if certain sessionStorage variables are present restoring the state of these features using appropriate jqWidgets API Methods in the ready callback and in some cases setting the grid Properties outside of the ready callback using the API Methods.. Some features I am making persistent don’t have Events that correlate directly to them so I have combined them with Event triggers that work just as well to set the required sessionStorage variables before navigating away from the page.

Persistent Features …

Checkbox Selection :: Working in all browsers I have tested
This is restored by setting the grid selectionmode property if my sessionStorage variables exist and set as follows…
… in jquery $(document).ready(function(){
var selectionMode = ‘none’;
if(showCheckboxes){
selectionMode = ‘checkbox’;
}
… later in grid definition
selectionmode: selectionMode,

Grid Data and Headers (I am working with multiple views that come from an XML source so I load up a data adapter and build the grid in a normal fashion, upon selection of a new view I use jQuery.get to get the new xml load up the data adapter and refresh) :: Works in All Browsers Tested.
This is of course done in the definition of the grid by manipulating the order of both the column headers and the and
the data elements, but I won’t elaborate here unless necessary as this works in all browsers. I will say this also
has nothing to do with the grid’s ready callback.

Column Order :: Works in All Browsers Tested.
This is of course done in the definition of the grid by manipulating the order of both the column headers and the and
the data elements, but I won’t elaborate here unless necessary as this works in all browsers. I will say this also
has nothing to do with the grid’s ready callback.

Last Selected Row :: Not working in IE8, works in all other browsers
This is restored in the ready callback using the API methods to do so and set as follows…
… after grid declaired
$(‘#searchresults’).on(‘rowdoubleclick’, function (event) {
var args = event.args;
var rowindex = args.rowindex;
var rowdata = $(‘#searchresults’).jqxGrid(‘getrowdata’,rowindex);
thisURL = rowdata[‘HREF’];
// use the sessionStorage variable ‘ipopsview_rowIndex’ to store the last row id selected
$(‘#searchresults’).jqxGrid(‘clearselection’);
$(‘#searchresults’).jqxGrid(‘selectrow’, rowindex);
sessionStorage.setItem(‘ipopsview_rowIndex’,rowindex);
… more stuff and close

Search Column and Order :: Not working in IE8, works in all other browsers
This is restored in the grid’s ready callback and set as follows…
$(‘#searchresults’).on(‘sort’, function (event) {
var datainformation = $(‘#searchresults’).jqxGrid(‘getdatainformation’);
var sortinformation = datainformation.sortinformation;
var sortColumn = sortinformation.sortcolumn;
var sortDirection = ‘null’;
if( sortinformation.sortdirection.ascending ) {
sortDirection = ‘asc’;
} else if( sortinformation.sortdirection.descending ) {
sortDirection = ‘desc’;
}
sessionStorage.setItem(‘ipopsview_sortColumn’,sortColumn);
sessionStorage.setItem(‘ipopsview_sortOrder’,sortDirection);
});

Page Number (using paging) :: Not working in IE8, works in all other browsers
This is restored in the grid’s ready callback and set as follows…
$(“#searchresults”).on(“pagechanged”, function (event) {
var args = event.args;
var pagenum = args.pagenum;
var pagesize = args.pagesize;
sessionStorage.setItem(‘ipopsview_pageNumber’, pagenum);
sessionStorage.setItem(‘ipopsview_pageSize’, pagesize);
});

Page Size :: Works in All Browsers Tested so not going to elaborate at the moment…

Here is the entire ready callback…

ready: function(){
// restore the state of the grid if it has been previously set
// use the sessionStorage variable ‘ipopsview_rowIndex’ to retrieve the last row id selected
var selectedRow = 0;
if (sessionStorage.getItem(“ipopsview_rowIndex”) !== null) {
selectedRow = Number(sessionStorage.getItem(‘ipopsview_rowIndex’));
}
$(“#searchresults”).jqxGrid(‘selectrow’, selectedRow);
// use the sessionStorage variable ‘ipopsview_pageNumber’ to retrieve the page number of the pager
var pageNumber = 1;
if (sessionStorage.getItem(“ipopsview_pageNumber”) !== null){
pageNumber = Number(sessionStorage.getItem(‘ipopsview_pageNumber’));
$(‘#searchresults’).jqxGrid(‘gotopage’, pageNumber);
}
// use the sessionStorage variables ‘ipopsview_sortColumn’ and ‘ipopsview_sortOrder’ to retrieve the last sort column and used and its direction
if (sessionStorage.getItem(“ipopsview_sortColumn”) !== null
&& sessionStorage.getItem(“ipopsview_sortOrder”) !== null) {
sortColumn = sessionStorage.getItem(‘ipopsview_sortColumn’);
sortOrder = sessionStorage.getItem(‘ipopsview_sortOrder’);
$(‘#searchresults’).jqxGrid(‘sortby’, sortColumn, sortOrder);
}

var loadingImg = $(‘#searchresults div.jqx-rc-all:first-child’);
loadingImg.css({visibility:”hidden”,display:”none”});
} // ************* END ON JQXGRID READY BLOCK ***************

One last symptom that I can throw out there is the time difference in the actual loading of the grid in IE8, It is much slower compaired to the other browsers. I don’t know what to make of this and have ready the forum entries about it, I only mention it to give a more complete scenario and don’t expect it to be a problem on the production servers.

I know this is a complected issue (or seems that way to me as I have run out of ideas, but this is just to get the ball rolling… I would be happy to supply more detailed code and/or fill in any gaps I have left in my explanation. I don’t want you to solve my problem for me, I am only really seeking insight into why you think the ready callback would be giving me issues in IE8 and possible lower version (don’t really care about them as the dept I am working for does not support them)… my code working flawlessly in IE9 and up as well as all modern non-toxic browsers.. 😉

Thanks for any assistance,
Justin

[Peter StoevKeymaster]

Hi Justin,

I am afraid that we do not find anything wrong with the “ready” callback in IE8. This example works fine in IE8 – http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/filtering.htm?arctic and the “ready” callback is called as expected. This example – http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/customsorting.htm?arctic is using the “ready” callback and works in IE8, too. If you have some specific scenario which works in a different way with jQWidgets 3.2.1, then please provide a working sample and we will test it.

Best Regards,
Peter Stoev

jQWidgets Team
http://www.jqwidgets.com/

[justin.mannParticipant]

Thanks for the attention Peter,

I am not sure what is going on here, I do have more input, but really at this point I think just sending u the full code segment makes more sense. Since I am translating XML via jQuery to feed this beasty I could easily provide that as well (thank goodness for the xml translation that takes place on the server as the datasource behind it is Domino and I have my doubts about u having a Domino instance at your disposal… lol).

I think before I bother you any more with this I am going to download the latest source for the newer version and test with it even tho I didn’t see any outstanding problems from the research I have done and no changes in the change log that would address any of this. I do appreciate your time and may very well be back on the forum in the near future either with a source to my mysterious issue or with full code so you can recreate the issue.

Thanks again Peter,
J

[Author]

Posts