DataTable reinit error

Dejvidus

Hi,
I'm trying to recreate datatable on ajax.succes. I tried to destroy the table before new init (but on first try it not inited yet), i also tried Destroy option on init. Even something like .clear(), .empty().

I'm clueless how to make it work.

https://pastebin.com/n3HnUmzQ

kthorngren

I think one problem is you are overwriting the HTML table before using destroy of the old Datatable. Try destroying the Datatable before you build the HTML table. You will need to use $.fn.dataTable.isDataTable() and destroy(). Somethign like this:

                    const briefsTable = $('#briefsTable');

                    if ( $.fn.DataTable.isDataTable( '#briefsTable' ) ) {
                      $('#briefsTable').DataTable().destroy();
                    }

                    briefsTable.html('<thead><tr><td></td><td style="width: 33%">Brief name</td><td>Hydra code</td><td style="width: 33%">Media type</td></tr></thead><tbody id="briefsBody"></tbody>');

Kevin

Dejvidus

I've used the condition but that solved only first run where destroy isn't called. It's called 4x times and i got 3 errors saying : "Unable to get property 'parentNode' of undefined or null reference"

Then i tried excluding the bDestroy property on init but that resolved in Datatables alert saying: "Datatables warning: table id=briefsTable - Cannot reinitialise DataTable. For more info.... datatables.net/tn/3

Thanks

colin

We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

kthorngren

One problem I see is that you have 4 columns defined in the thead but are populating the table with five columns. They need to match or Datatables won't work properly. If this doesn't help then as Colin says we will need a test case to take a look.

Kevin