Why buttons not showing after destroying the table and reinitializing it?

vturnus

Code

function tableData(value) {
  
  var depotId = value;
  
  // initialize the datatable 

  table = $('#manageTable').DataTable({
    retrieve: true,
    dom: 'Bfrtip',
    buttons: [
          {
            className: 'btn btn-primary btn-excel-margin',
            text: 'Excel output',
            extend: 'excelHtml5',
            exportOptions: {
              columns: [1,2,3,4,5,6,7,8,9,10,11,12]
            },
            customize: function ( xlsx ) {
              var sheet = xlsx.xl.worksheets['sheet1.xml'];
              
             $('c[r=A1] t', sheet).text('Commodities');
                },
          }
          
        ],
    'ajax': {
              'url': base_url + 'received/fetchReceivedData',
              'data': {depotId: depotId },
              'type': 'POST',
              "dataType": "json",
            },
    'order': [],
    
  });
  
  table.destroy();

}

// end

this function is called every time I change a value and everything works fine except that button and search bar doesn't show.

Edited by Colin - Syntax highlighting. Details on how to highlight code using markdown can be found in this guide.

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

vturnus

Dear @colin
Here is my test code http://live.datatables.net/hamopoqi/1/edit?html,js,output

description:

the select field allows you to select some store and then the table makes an ajax call with store id and gets the values of that store.
this is with PHP with CodeIgniter framework with MVC architecture so right now in the test code you can't select any store and to be honest I don't know how to implement them in the test code.

Problem:

as I mentioned before the buttons won't show up after a store is selected and data is retrieved. but when I omit the destroy() function the buttons do show up but my code won't work as I wanted to.
I also tried clear().draw(); but again my table won't get new data if I change the store.

Appreciate your time.

Regards
-V

kthorngren

Your test case doesn't run so we can't try the steps you outlined.

I suspect the problem is that you are using table.destroy(); right after you initialize the Datatable. You will want to execute this before reinitializing Datatables. You can use DataTable.isDataTable() to see if the Datatable exists before destroying it.

If you need further help please provide a link to a running test case that shows the issue.

Kevin

vturnus

Thanks a lot, @kthorngren.
Your guide solved the problem.
Cheers,
-V