Hi all,
I have a scenario where my my dataTable will be repopulated with data whenever the user changes the "search" criteria used to populate the table. Depending on the search criteria they select, the data source may come from a different web service. The number of columns and column headers returned will always be the same, but the data itself will be different. Whenever the user changes the criteria, I call
$('#myTable').DataTable().destroy();
I then refresh the data. Most of the time, the data loads fine, but on occasion, I get the following javascript errors. The datatable still loads despite the error. To make it more interesting, 90% of the time that I get the error the table is formatted correctly, but sometimes after getting the error, the "hidden columns" are visible.
FireFox reports:
TypeError: headerCells[i] is undefined
headerCells[i].style.width = column.sWidthOrig !== null && column.sWidthOrig !==...
(error originates from jquer.dataTables.js - line 4089 to be exact)
Chrome and IE report:
Unhandled exception at line 4089, column 5 in http://localhost/xxxxx/Scripts/jquery.dataTables.js
JavaScript runtime error: Unable to get property 'style' of undefined or null reference
My question, is if I just want to refresh the data (may require pointing to a different webservice), but the number of columns and column names stay the same, do I need to detroy or do I need to destroy and empty the table? Also, is this a user error or a bug?
Thanks,
JE