what is the proper way to refresh a datatable that's already initialized?

lpace

Link to my project page: http://aomppapp.gmaom.us:8080/get_cotg_form?id=dashboard2.html
Error: "Cannot reinitialize Data Table"

I have a page with several tabs. when a tab is clicked, the page initializes a specific ajax sourced datatable. If the tab is clicked a second time, the "Cannot reinitialise DataTable" error is thrown. What is the proper way to avoid this error and handle the click event?

colin

I flicked around tabs and was unable to see the problem. There's a lot of code on that page too - it would help if you could provide minimum code that demonstrates the issues. 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

lpace

Hi @colin

To see the problem I'm asking about, do the following:
visit http://aomppapp.gmaom.us:8080/get_cotg_form?id=dashboard2.html
click on the RMA tab once. The table will load.
click on the Cores tab and that table will also load. Now click back to the RMA tab and you'll see the error.
I'm wondering what the correct code is to reload the table, using the ajax data I've already got when the table was first initialized.
Here is the code that generates the table, the rest of the code on that page is for the other tabs and other functionality in the project.

$('.rma_load').click( function(){

$('#rmas').DataTable({                 
  "ajax":
  {"url": "http://aomppapp.gmaom.us:9090/get_RMA?PO_NUM=*",                        
  },
   "columns": [
     { "data": "Record.NAME" },
     { "data": "Record.NAME_ID" },
     { "data": "Record.RECID" },
     { "data": "Record.OPEN_DATE" },
     { "data": "Record.SYS_STBR" },
     { "data": "Record.PART_NO" },
     { "data": "Record.QSHP" },
     { "data": "Record.DESCRIPTION" },
     { "data": "Record.RETURN_REASON" },
 
   ],
 
});


    

    

 

});

lpace

Did a bit of reading on https://datatables.net/manual/tech-notes/3
it seems I should be using the retrieve option:
'''
$('.rma_load').click( function(){

$('#rmas').DataTable({
"retrieve":true,
"ajax":
{"url": "http://aomppapp.gmaom.us:9090/get_RMA?PO_NUM=*",
},
"columns": [
{ "data": "Record.NAME" },
{ "data": "Record.NAME_ID" },
{ "data": "Record.RECID" },
{ "data": "Record.OPEN_DATE" },
{ "data": "Record.SYS_STBR" },
{ "data": "Record.PART_NO" },
{ "data": "Record.QSHP" },
{ "data": "Record.DESCRIPTION" },
{ "data": "Record.RETURN_REASON" },

],

});

});
```
maybe this will help others!
thanks @colin for looking into it for me, let me know if there's more to it.