that.s is null, Using Local Storage For State Save

gwallsjr

With the DataTables core, I have additionally implemented the ColReorder, ColVis, and Table Tools Plugins. One key functionality that I am implementing is User Preference saving. This means that I am using local storage to save which columns the user has hidden and the current order in which they are displayed.

NOTE (This is probably the root cause): The table is built dynamically on success of an AJAX call...., the user submits their criteria to the controller/mapping through an jQuery Ajax call, the mapping queries our internal webservice, the controller sends the json string back to the initial jQuery AJAX function which then calls another javascript function to build the table.

This is our jQuery AJAX call....
$('form').ajaxSubmit({
data: {
requestType : 'POSITIONS'
},
success: function(responseText, statusText, xhr, $form) {
if(responseText.PODSSearchResults) {
var results = responseText.PODSSearchResults;
if(results.positionSummaryResponse) {
showPositionResults(results.positionSummaryResponse);
posData = true;
}
}
},
error: function() {
alert("Error Occured while processing the request");
}
});

This is the showPositionResults function.....

function showPositionResults(positionData)
{
$("#positionTable").show();
var positionCache = new Array();

if (pTable != null)
{
pTable.fnDestroy();
}

var pTable = $('#positionTable').dataTable({
sDom : 'TC<"clear">Rlfrtip',
aaData : positionData,
bScrollCollapse : true,
sScrollX : "100%",
sScrollXInner : "125%",
bJQueryUI : true,
bPaginate : true,
bServerSide : false,
bStateSave : true,
fnStateSave : function (oSettings, oData){
window.localStorage.setItem('DataTables_Position_'+window.location.pathname, JSON.stringify(oData));
},

fnStateLoad : function (oSettings){
return JSON.parse(window.localStorage.getItem('DataTables_Position_'+window.location.pathname));
},
bDestroy : true,
sPaginationType : "input",
oTableTools : { "sSwfPath": contextRoot + "/js/library/dataTables/copy_csv_xls_pdf.swf" },
oColReorder : { "iFixedColumns" : 3 },
oColVis : { "aiExclude": [0,1,2] },
aoColumns : [
{ sTitle : "", mData : null, sDefaultContent : '' },
{ mData : "accountId", sDefaultContent : "", sClass : "underline" },
{ mData : "instrumentId", sDefaultContent : "" },
{ mData : "regionCode", sDefaultContent : "" },
{ mData : "accountCode", sDefaultContent : "" },
{ mData : "instrumentCode", sDefaultContent : "" },
{ mData : "instrumentName", sDefaultContent : "" },
{ mData : "bookValueAmount", sDefaultContent : "", sClass : 'alignRight', mRender: function(data) { return $.number(data, 2); } },
{ mData : "restrictionCodeName", sDefaultContent : "" },
{ mData : "strategyCodeName", sDefaultContent : "" },
{ mData : "longShortIndicatorName", sDefaultContent : "" },
{ mData : "postingTypeCode", sDefaultContent : "" }
]
});

.
.
.
.

The problem:

In IE 8 (which does support local storage) our UI hangs (no response, no result set), and them prompts the user with file download options. The filename is the controller mapping the first javascript function hits appended with what seems to be a memory address...

From the browser console... DataTables breaks at ColReorder.js line number 502... The exact message is 'that.s.dt' is null or not an object. From the console Firefox 10.0.9 gives me the same error - but there is no download prompt.

FYI info we are using Spring MVC on the back-end.

Thanks Allan.

allan

Can you link to a test case please: http://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read .

Also, if you are using the very latest version of ColReorder (i.e. the 1.1.0 nightly) I'd suggest you try that: http://datatables.net/download/ .

Allan

saurabhjoshi

Hi,

I am facing the same problem. Any solution??

allan

As noted link to a test case please: http://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read .