I'm getting two errors in my console upon viewing a webpage. Datatables is being used, and I am quite sure (as the errors state) that the issue is related to Datatables. The problem here is that I did not write this code, I am merely now trying to fix issues in the code. The odd thing is that this section of the code should have been working before, as I can visibly see it working on the live version. Am I correct in what I believe to be the error? If so, what is the best way to go about debugging this, when the code is not made by me, and the code and data is in large quantities?
DataTables warning: Unexpected number of TD elements. Expected 2040 and got 1981. DataTables does not support rowspan / colspan in the table body, and there must be one cell for each row/column bination. jquery.dataTables.js:5840
Uncaught TypeError: Cannot read property 'parentNode' of undefined. jquery.dataTables.js:2843
I'm getting two errors in my console upon viewing a webpage. Datatables is being used, and I am quite sure (as the errors state) that the issue is related to Datatables. The problem here is that I did not write this code, I am merely now trying to fix issues in the code. The odd thing is that this section of the code should have been working before, as I can visibly see it working on the live version. Am I correct in what I believe to be the error? If so, what is the best way to go about debugging this, when the code is not made by me, and the code and data is in large quantities?
Share Improve this question asked Jun 3, 2013 at 18:07 ComputerLocusComputerLocus 3,61812 gold badges52 silver badges99 bronze badges 2DataTables warning: Unexpected number of TD elements. Expected 2040 and got 1981. DataTables does not support rowspan / colspan in the table body, and there must be one cell for each row/column bination. jquery.dataTables.js:5840
Uncaught TypeError: Cannot read property 'parentNode' of undefined. jquery.dataTables.js:2843
- Ok, you dont need to post the actual site with data code, but you do need to post your datatables() function code, and the static table html , neither should contain sensitive info, and the problem can be diagnosed more than likely by reviewing those things, the table may be out based on your constraints but the datatables() should be easily found in the source – Jay Rizzi Commented Jun 4, 2013 at 0:53
- @JayRizzi The problem is that almost all of the data in the table is sensitive data. In Richard's answer I supplied some sample HTML and Javascript that was used. That is only part of it, as it is a lot of data that would need censoring. – ComputerLocus Commented Jun 4, 2013 at 15:43
6 Answers
Reset to default 6Do you have a URL that you can post so that we can take a look?
Cannot read property
parentNodeof undefined
is a javascript error that happens because you are trying to get the parentNode
of something that doesn't exist.
The other error seems quite obvious? The number of TD elements in a TR is not in line with the rest of the table. Look at the HTML and check if the number of TD & TH elements in the THEAD, TFOOT and TBODY are all the same count. "DataTables does not support rowspan / colspan in the table body"
Please post a URL or HTML/JS snippet of the table, preferrably on http://www.jsfiddle
Unrelated to this specific case, but might e in useful for anyone else searching for this issue.
I had the same error and it turned out to be caused by specifying a sort column that didn't exist. I specified column 11, but the table only had 10 columns.
I had the same error but different solution resolved it.
I had already set the property destroy : true
while initializing the datatable. This helps in re-initializing the table.
Issue :
In datatable you have to provide a property 'columns': columnArray,
while initializing.
It looks something like:
$('#example').dataTable( {
"ajaxSource": "sources/objects.txt",
"columns": [
{ "data": "engine" },
{ "data": "browser" },
{ "data": "platform" },
{ "data": "version" },
{ "data": "grade" }
],
destroy: true
} );
This columnArray
has to be populated based on ajax data. I was populating this for every ajax call, thus bloating up the array with multiple entries for the same columns. I fixed it by re-initializing the array to []
.
destroying the table w/o checking whether it is a data table or not was causing the problem for me so it got resolved by adding the below check
var table = $('#tableName')
if (!$.fn.DataTable.isDataTable('#tableName')) {
return;
}
else {
var table = $('#tableName').DataTable();
table.destroy();
}
I had this problem and I solved it by empty the table before any refresh or refill:
$('#table').empty();
$('#table').dataTable(...);
I had this problem and I solved it by adding sDom:
sDom: '<"top"><"clear">rt<"bottom"><"clear">'
Before it was:
sDom: ''