Responsive datatable

dbrody2004

We have a responsive datatable with a column that has a number of buttons. Responsive works fine except for the column - it doesn't wrap the buttons inside the column. Any idea how to fix it>

kthorngren

Maybe you can use responsive.details.renderer to apply any classes, etc to wrap the buttons when they are hidden.

Kevin

colin

It would also be worth calling responsive.recalc() after you've created those buttons, since the Responsive code is probably calculating the width off the cell without them.

dbrody2004

I have the following code, but doesn't fix resizing the column with buttons. Anytime the table is clicked (ie opening the row), it fires. No javascript errors either.

$('.datatable-basic').on('click',function(event) {
$('.datatable-basic').DataTable().columns.adjust();
$('.datatable-basic').DataTable().responsive.recalc();
});

kthorngren

Did you try responsive.details.renderer?

Here is a simple example. To validate the wrapping works you can change the Edit th name to something else and you will see the buttons don't wrap.
http://live.datatables.net/rasetaxe/3/edit

Note I use this CSS:

table.dataTable.nowrap td.td-buttons {
    white-space: normal;
}

Kevin