jQuery how to fix Cannot set property '_DT_CellIndex' of undefined?
From your code, I don't see the DataTabe initialization, usually placed inside the Document Ready function. So:
- Try to Initialize your table with an explicit configuration for each column ("visible:true" is a dummy setting that just confirms it is visible)
- Add the "datatable" class to your table html. Example:
Example:
$(document).ready(function () {var myTable= $('#tablebqup').DataTable({ columns:[ //"dummy" configuration { visible: true }, //col 1 { visible: true }, //col 2 { visible: true }, //col 3 { visible: true }, //col 4 { visible: true }, //col 5 { visible: true }, //col 6 { visible: true }, //col 7 { visible: true } //col 8 ] });});
And on the html:
<table id="tablebqup" class="tableau table datatable table-fixed table-bordered table-dark table-hover ">
Explanation:
The "DataTable" initialization method should have the same number of columns on its configuration as the number of <th>
's/<td>
's on your html.
Wrong example:
//Javascript Code var myTable= $('#myTableId').DataTable({ columns: [ //any column configuration { "bSearchable": false }, //col 1 { "bSearchable": true }, //col 2 { "bSearchable": true }, //col 3 { "bSearchable": false }, //col 4 { "bSearchable": false }, //col 5 { "bSearchable": false } //col 6 ]});
And the html markup:
<table id="myTable" class="table datatable"><thead> <tr> <th>col 1 header</th> <th>col 2 header</th> <th>col 3 header</th> <th>col 4 header</th> </tr></thead><tbody> <tr> <td> data col 1, row 1</td> <td> data col 2, row 1</td> <td> data col 3, row 1</td> <td> data col 4, row 1</td> </tr></tbody></table>
So even if the number of <td>
's and <tr>
's are matching on the html, having more columns configured on the DataTable method will cause this exception to be thrown. In this example, removing the configuration lines for col 5 and col 6 from the DataTable method would fix the error.