oSettings is null after table reload
oSettings is null after table reload
I've seen a couple of things in the forms related to this issue, but I haven't been able to figure out how to fix what has been a puzzling issue.
First off, my DataTables application is set up to get table settings and data from the server side, with the table available for local edits until a user selects a "submit" button to post data to the database. This generally is working great, except for when the user closes the table and reopens it. Then it appears to load properly and function...but all my click events and attempts to access the DataTables object fail.
- Open a DataTable in a tab
- Close the tab (and destroy the dataTable)
- Re-open the tab, creating a new dataTable
Result - table appears to open and native datatables functionality works great. But all my click events result in failures -- mostly oCol is Undefined (e.g. line 737) or oSettings is null (line 4522). Basically it chokes whenever I try to access the DataTables object -- e.g. fnGetData() or fnGetPosition(aCell).
When I examine the table in the DataTools debugger I see all my table variables appear to be set and are exactly as they are on initial table load. What I won't understand is how everything seems initialized and proper on the table definition but I can get any oSettings. At first I thought this might be a variable scope thing, especially when I saw a prior post about initializing the table with jQuery potentially causing an issue, but I can't figure out why I have no oSettings available at all. And I am stuck on how to solve it.
For context, here's a snippet of simplified code. For brevity I took out the stuff that doesn't seem pertinent, and unfortunately my app isn't immediately accessible publicly. I can mock something up later today online if needed, but I thought I'd try this route first.
Thanks so much for your help!
[code]
function showDataTable(formId) {
// Note: prepDataTable grabs column definitions, labels, etc. that are needed to initialize the datatable
$.post(baseURI + '/prepDataTable',{},
function(result, status) {
if (result && status == "success") {
displayColumns = result.displayColumns;
var oTable = $('#' + formId).dataTable( {
"bServerSide": false,
"sAjaxSource": baseURI + "/makeDataTable",
"aoColumnDefs": displayColumns,
"fnServerData": function (sSource, aaData, fnCallback ) {
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aaData,
"success": fnCallback
} );
}
// dataTable definition here...
// tableTool button definitions here...
});
oTable.makeEditable({
// editable definitions here
"aButtons": ["copy", "csv", "pdf",
{ // Close Table just closes the table's tab and destroys the datatable
"sExtends": "text",
"sButtonText": "Close Table",
"fnClick": function ( nButton, oConfig, oFlash ) {
closeNewerTab();
closeSelectedTab();
oTable.fnClearTable();
oTable.fnDestroy();
}
}
]
});
// define misc click events here... (tab, pulldown menu behavior, etc.
}
}
} ); // ajax call
}
[/code]
First off, my DataTables application is set up to get table settings and data from the server side, with the table available for local edits until a user selects a "submit" button to post data to the database. This generally is working great, except for when the user closes the table and reopens it. Then it appears to load properly and function...but all my click events and attempts to access the DataTables object fail.
- Open a DataTable in a tab
- Close the tab (and destroy the dataTable)
- Re-open the tab, creating a new dataTable
Result - table appears to open and native datatables functionality works great. But all my click events result in failures -- mostly oCol is Undefined (e.g. line 737) or oSettings is null (line 4522). Basically it chokes whenever I try to access the DataTables object -- e.g. fnGetData() or fnGetPosition(aCell).
When I examine the table in the DataTools debugger I see all my table variables appear to be set and are exactly as they are on initial table load. What I won't understand is how everything seems initialized and proper on the table definition but I can get any oSettings. At first I thought this might be a variable scope thing, especially when I saw a prior post about initializing the table with jQuery potentially causing an issue, but I can't figure out why I have no oSettings available at all. And I am stuck on how to solve it.
For context, here's a snippet of simplified code. For brevity I took out the stuff that doesn't seem pertinent, and unfortunately my app isn't immediately accessible publicly. I can mock something up later today online if needed, but I thought I'd try this route first.
Thanks so much for your help!
[code]
function showDataTable(formId) {
// Note: prepDataTable grabs column definitions, labels, etc. that are needed to initialize the datatable
$.post(baseURI + '/prepDataTable',{},
function(result, status) {
if (result && status == "success") {
displayColumns = result.displayColumns;
var oTable = $('#' + formId).dataTable( {
"bServerSide": false,
"sAjaxSource": baseURI + "/makeDataTable",
"aoColumnDefs": displayColumns,
"fnServerData": function (sSource, aaData, fnCallback ) {
$.ajax( {
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aaData,
"success": fnCallback
} );
}
// dataTable definition here...
// tableTool button definitions here...
});
oTable.makeEditable({
// editable definitions here
"aButtons": ["copy", "csv", "pdf",
{ // Close Table just closes the table's tab and destroys the datatable
"sExtends": "text",
"sButtonText": "Close Table",
"fnClick": function ( nButton, oConfig, oFlash ) {
closeNewerTab();
closeSelectedTab();
oTable.fnClearTable();
oTable.fnDestroy();
}
}
]
});
// define misc click events here... (tab, pulldown menu behavior, etc.
}
}
} ); // ajax call
}
[/code]
This discussion has been closed.