Not able to reload the dataTable using ajax.url.load() method at clientside processing

Not able to reload the dataTable using ajax.url.load() method at clientside processing

Rev041Rev041 Posts: 1Questions: 1Answers: 0
edited September 2014 in Free community support

I'm new to jQuery and just started experimenting on dataTables - client side processing.I know that for clientside processing of dataTables all the data needs to be fetched at once from server, but I still need to fetch some data on an event trigger and reload the dataTable again with the new data fetched. What I'm doing is fetch a list of JSON data from server side via AJAX call on the change event of a dropdown box. The ajax response is fed to a html table and after the table is populated I set a dataTable for it. So each time I select a different entry in the dropdown I need to triger this ajax and reload the datatable if it already exists.

Problem is just before the dataTable is loaded the first time I get the http://datatables.net/tn/3 warning message saying dataTable cannot be reinitilised. Also after I trigger the second ajax call by selecting another value in dropdown I get Ajax error message from dataTable datatables.net/tn/7. After this error I get the new data display in raw html format, dataTable will not have initialized. What is that I'm doing wrong here ? Thanks.

 if ($.fn.dataTable.isDataTable('#htmlTableID'))

 {
     oTableJq.ajax.url('/getTableData.spr').load();

 } else {

     oTableJq = $('#htmlTableID').dataTable({
         "sPaginationType": "full_numbers",
         "bLengthChange": false,
         "bInfo": true,
         "iDisplayLength": 10
     });
     oTableJq = $('#htmlTableID').DataTable({
         ajax: "data.json"
     });

 }

Answers

  • allanallan Posts: 61,665Questions: 1Answers: 10,096 Site admin

    You can only configure a DataTable once - so move the ajax option into the other initialisation, and use $().DataTable() - see the second top FAQ for why.

    See also the options manual:

    The object being passed in is just a standard Javascript object and can be treated as such. Add as many options as you wish!

    Allan

This discussion has been closed.