Answers

• leddy Posts: 16Questions: 5Answers: 1

  May 2015

  I use this and it works for me

  $('#searchResults').dataTable().fnDestroy();
  
• allan Posts: 63,498Questions: 1Answers: 10,471 Site admin

  May 2015

  @nbaleli - Can you link to a test case showing the issue please? Your code looks like it should work okay - with the empty() call back in.

  Allan
• nbaleli Posts: 2Questions: 1Answers: 0

  May 2015 edited May 2015

  sorry I forgot to mention, my HTML contained only the <table> element. the columns are created dynamically after the ajax call. that's the reason I couldn't initialize the table with empty config object.

  I fixed it by defining a hoisted 'table' variable at the top, and referencing it when ever a new ajax call is made:

  $(document).ready(function() {
    var table;
  
    $('#searchBtn').click(function(e){
      e.preventDefault();
  
      .....
  
      Api.getDeposits(formData).then(function(res){
        var columns = [];
  
        if (res[0]) {
          Object.keys(res[0]).forEach(function(key){
            columns.push({
              data: key,
              title: key
            })
          });
  
          if (table) { 
            table.destroy(); 
            $('#searchResults').empty();
          }
  
          table = $('#searchResults').DataTable( {
            "destroy": true,
            "data": res,
            "scrollX": "100%",
            "columns": columns
          });
        }
  
        ...
      });
    })
  
  });