How can I adjust the columns after initializing server-side processing datatable?

Question

When my server-side processing datatable is loaded the header is broken. To resolve this, I added table.columns.adjust().draw() to my initComplete function:

var table = $('.table').DataTable({
   "serverSide": true,
   /// more code...
   "initComplete": function(settings, json) {
       table.columns.adjust().draw();
   }
});

This works, but it affected the pagination. The correct page is not displayed anymore. It is set back to to first page. How can I prevent this?

What DataTables version are you using? – palaѕн Apr 16 '20 at 13:55 — palaѕн, Apr 16 '20 at 13:55
and DataTables Bootstrap 3 integration – peace_love Apr 16 '20 at 14:00 — peace_love, Apr 16 '20 at 14:00

palaѕн · Accepted Answer · 2020-04-16T14:04:15.703

1

For DataTables version > 1.10.x, you can simply pass false to draw() api which will redraw the table but maintaining current paging position like:

table.columns.adjust().draw( false );

As mentioned in the docs:

paging false
- the ordering and search will be recalculated and the rows redrawn in their new positions. The paging will not be reset - i.e. the current page will still be shown.

edited Apr 16 '20 at 14:04

answered Apr 16 '20 at 14:02

palaѕн

72,112
17
116
136

Oh thank you so great! I was searching so mucg for a solution, how did you know that? – peace_love Apr 16 '20 at 14:04
1

I have been using datatable for past few years :) I have also added docs links. – palaѕн Apr 16 '20 at 14:05

How can I adjust the columns after initializing server-side processing datatable?

1 Answers1