Reload datatable after ajax

Question

I use JQuery dataTable version 1.9. I need to reload a datatable after ajax success because I filter the elements after my query so the pagination shows all elements and not just the "real" ones filtered after the query. I know it is wrong to do this but I can only check after the query

Here it seems that there are no elements

But when scrolling through the pagination the elements are there

Ahmed Elgammudi · Accepted Answer · 2020-10-23 14:36:02Z

1

you can use setInterval for reloading the datatable after ajax reuqest

setInterval(function(){
    $('#tableid').DataTable({
 });
}, 300);

edited Oct 23, 2020 at 14:36

user14325562

answered Oct 23, 2020 at 9:38

Ahmed Elgammudi

7467 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Wall3-8e Over a year ago

i'm using your code in fnDrwCallback.... but i have this alert: DataTables warning (table id = 'pro'): Cannot reinitialise DataTable. To retrieve the DataTables object for this table, pass no arguments or see the docs for bRetrieve and bDestroy

Ahmed Elgammudi Over a year ago

this problem happen when you make many then one call $().DataTable({})

Ahmed Elgammudi Over a year ago

i think you need to add "retrieve: true"

Wall3-8e Over a year ago

i try to insert setInterval(function(){ $('#mydatatable').dataTable({bRetrieve: true}); }, 300); but in this case don't have errors but my datatable always remains the same

Ahmed Elgammudi Over a year ago

github.com/AhmedELGAMMUDI/… check this link

user14325562 · Accepted Answer · 2020-10-23 09:41:55Z

0

Please test this solution

function refreshTable() {
  $('.dataTable').each(function() {
      dt = $(this).dataTable();
      dt.fnDraw();
  })
}

answered Oct 23, 2020 at 9:41

user14325562

1 Comment

Wall3-8e Over a year ago

I have too many row.... Uncaught RangeError: Maximum call stack size exceeded

VinhNT · Accepted Answer · 2020-10-26 01:58:47Z

0

If you are going to reload datatable after ajax call, then, you should have the data as a list of object. Let's say it is stored in data Then, reload table by

function reloadDataTable(tableObject, data) {
    tableObject.clear().rows.add(data).draw();
};

answered Oct 26, 2020 at 1:58

VinhNT

1,1119 silver badges14 bronze badges

Collectives™ on Stack Overflow

Reload datatable after ajax

3 Answers 3

5 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

5 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related