Error Message ("Cannot reinitialise DataTable") When Table is Blank
Error Message ("Cannot reinitialise DataTable") When Table is Blank
I am using dataTables 1.7.3 and obviously I love it.... a truly amazing script!
I am, however, having a small problem that I'm hoping someone can help with.
I have the script setup to run on a 7 column table using the following code:
[code]
script src="/jquery/jquery-1.4.3.min.js" type="text/javascript">
<!-- Interactive tables -->
<!-- dataTables end -->
$(document).ready(function() {
$('#datatable').dataTable( {
"aoColumns": [
{ "sType": "html",
"sWidth": "200px"},
{ "bSearchable": false},
{ "bSearchable": false},
{ "bSearchable": false},
{ "bSearchable": false},
{ "bSearchable": false},
{ "sWidth": "140px" }
],
"bJQueryUI": false,
"sPaginationType": "full_numbers",
"iDisplayLength": 25,
"bAutoWidth": false,
"aaSorting": [ ] // Prevents initial sorting
} );
} );
[/code]
Normally this works perfectly.
The data for this table is dynamic in the sense that when a user loads the page, our system fetches the information from our database and plugs it into the table. Then DataTables works it's magic!
The problem is that there are times when the table will be empty. When this happens, we have this code appear in the table:
[code]
You do not have any current emails. Click here to create a new one.
[/code]
But, as soon as that happens, there is a popup alert saying:
[code]DataTables warning (table id = 'datatable'): Cannot reinitialise DataTable.
To retrieve the DataTables object for this table, please pass either no arguments to the dataTable() function, or set bRetrive to true. Alternativly, to destroy old table and create a new one...ETC.[/code]
Is there a way to prevent this from happening? Any insight is greatly appreciated!
Thanks in advance.
I am, however, having a small problem that I'm hoping someone can help with.
I have the script setup to run on a 7 column table using the following code:
[code]
script src="/jquery/jquery-1.4.3.min.js" type="text/javascript">
<!-- Interactive tables -->
<!-- dataTables end -->
$(document).ready(function() {
$('#datatable').dataTable( {
"aoColumns": [
{ "sType": "html",
"sWidth": "200px"},
{ "bSearchable": false},
{ "bSearchable": false},
{ "bSearchable": false},
{ "bSearchable": false},
{ "bSearchable": false},
{ "sWidth": "140px" }
],
"bJQueryUI": false,
"sPaginationType": "full_numbers",
"iDisplayLength": 25,
"bAutoWidth": false,
"aaSorting": [ ] // Prevents initial sorting
} );
} );
[/code]
Normally this works perfectly.
The data for this table is dynamic in the sense that when a user loads the page, our system fetches the information from our database and plugs it into the table. Then DataTables works it's magic!
The problem is that there are times when the table will be empty. When this happens, we have this code appear in the table:
[code]
You do not have any current emails. Click here to create a new one.
[/code]
But, as soon as that happens, there is a popup alert saying:
[code]DataTables warning (table id = 'datatable'): Cannot reinitialise DataTable.
To retrieve the DataTables object for this table, please pass either no arguments to the dataTable() function, or set bRetrive to true. Alternativly, to destroy old table and create a new one...ETC.[/code]
Is there a way to prevent this from happening? Any insight is greatly appreciated!
Thanks in advance.
This discussion has been closed.
Replies
Thanks for the reply. My apologies for the confusion about "as soon as that happens".
What I mean is that when the web page loads, if there is actual rows of data (with all 7 columns) in the table, then everything works perfectly.
However, if there are no rows of data with 7 columns in the table, and the contents of the table is just this:
[code]
You do not have any current emails. Click here to create a new one.
[/code]
Then I get that error message saying "DataTables warning (table id = 'datatable'): Cannot reinitialise...".
All the code I have on the page was included in my original post. So, the only instance of this "$('#datatable').dataTable)" is where you see it.
I assumed the problem must be related to dataTables looking for the 7 columns of data in the table and not finding it... but I could be totally wrong.
Any insight is greatly appreciated!
Thanks again.
[code]
You do not have any current emails. Click here to create a new one.
[/code]
which would fix the issue if it is related to the bumber of columns, but I would try adding "bRetreive": True to the initialization object of datatables first.
But, now in FireFox Error Console I see:
sData is undefined
In IE, I get an error saying:
'length' is null or not an object
I also can't put all those blank TD's because then it ruins the layout. It forces the first column to be narrow and the whole message does not fit in it. I can't even adjust the width of that column because then it will distort all my column headings.
Any other ideas? I'm open to trying anything!
[code]
You do not have any current emails. Click here to create a new one.
[/code]
to the table?
I've done some addition testing and I think the issue is that as soon as I have a row that spans multiple columns (ie. colspan="4") it kills the DataTables script and produces that pop-up alert.
Here is an example from one of my pages:
(Note: This is different than the previous example b/c this one only has 4 columns.)
This is at the top of the file:
[code]
<!-- Main jQuery library -->
<
$(document).ready(function(){
/* Create an array with the values of all the checkboxes in a column - Makes checkboxes work for sorting */
$.fn.dataTableExt.afnSortData['dom-checkbox'] = function ( oSettings, iColumn )
{
var aData = [];
$( 'td:eq('+iColumn+') input', oSettings.oApi._fnGetTrNodes(oSettings) ).each( function () {
aData.push( this.checked==true ? "1" : "0" );
} );
return aData;
};
var oTable = $('#datatable').dataTable({
"aoColumns": [
{ "sType": "html" },
null,
{ "sSortDataType": "dom-checkbox",
"sType": "html"},
{ "bSortable": false,
"bSearchable": false}
],
"bJQueryUI": false,
"sPaginationType": "full_numbers",
"aaSorting": [ ] // Prevents initial sorting
});
// WORK AROUND FOR CHECKBOX FIELDS
$("#modform").submit(function(){
var nNodes = oTable.fnGetHiddenNodes();
for (var i = 0; i < nNodes.length; i++) {
if ($('input:checked',nNodes[i]).val()) {
var nHidden = document.createElement( 'input' );
nHidden.type = 'hidden';
nHidden.name = "disp";
nHidden.value = $('input:checked', nNodes[i]).val();
this.appendChild( nHidden );
}
}
});
});
[/code]
This version of the table works perfectly:
[code]
Column A
Column B
Column C
Column D
General
0
[/code]
This version of the table produces the error saying:
""DataTables warning (table id = 'datatable'): Cannot reinitialise DataTable.
To retrieve the DataTables object for this table, please pass either no arguments to the dataTable() function, or set bRetrive to true. Alternativly, to destroy old table and create a new one...ETC."'
[code]
Column A
Column B
Column C
Column D
You have no groups.
[/code]
Does anyone know how I can get DataTables to not spit out this nasty warning when we have just one row of data that spans all columns?
I've tried everything I can think of and have had no luck.
Everything else is working so perfectly (and is amazing!), but as soon as visitors to my page see this pop-up alert saying "Cannot reinitialise DataTable" it scares them.
Any help is very greatly appreciated!
I'm sure other people may occasionally need to use colspans, so I hope this thread is helpful for them, too.
Thanks in advance!
I think the problem you're having is that the javascript is firing before the data is loaded. To get around this make sure the script is located BELOW the table that is being populated.
I had the exact same problem when I had the script as part of my global.js file in the header of the page. As soon as I moved the dataTable portion below the table it was initializing it all worked fine.
Hope that helps someone!
Basically, AFAIK, you cannot, or at least not elegantly with a colspan'd message.
The hack I have in place is to check for num records; if none found, don't display the data tables class flag for this particular page. I still get the data tables styling and no annoying alert window.
Unfortunate to have to do this checking in each data tables page, pointless boilerplate. Would be nice if we could add an id attrib a la No records found and have dataTables suppress the alert warning accordingly....
Possibly - but is has rather spun out from its original post, where the title was accurate.
> Basically, AFAIK, you cannot, or at least not elegantly with a colspan'd message.
Does sZeroRecords ( http://datatables.net/usage/i18n#sZeroRecords ) not provide what you need?
Allan
I also have problem with ""DataTables warning (table id = 'datatable'): Cannot reinitialise DataTable. as well and the error gone away when I set the "bRetrieve " to "true", but I get the duplicate data in each Tap and all Taps have the same rows. Does anyone know, please tell me?
Allan