How do I turn off column resizing when I hide columns?

wachusett16

I have a form that submits an ajax request which generates a dataTable, 21 columns and we want to see them all on the screen when the report runs, and allow the user to hide columns 7 - 21, and keep the first 6 column widths set without resizing. In fact it would be great if the hide/unhide didn't change the column widths at all.

$('#myJobTable').DataTable({
"scrollY": "75%",
"scrollX": true,
"paging": false,
"searching": true,
"autoWidth": false,
"info": false
});

I'm using autoWidth to allow me to use css to set column max-widths - which seems to work fine... Until I start hiding columns. When I do, all the columns get wider, even the ones with max-width set.

I've tried adding

columnDefs: [
{ "width": "25", "targets": 0 },
{ "width": "25", "targets": 1 },
{ "width": "25", "targets": 2 },
{ "width": "25", "targets": 3 },
{ "width": "125", "targets": 4 },
{ "width": "25", "targets": 5 }
],
fixedColumns: true

which doesn't help.

Is there a way to accomplish this with dataTables?

colin

That's not possible, I'm afraid. When you hide columns, the others are expanded to fill the width of the container.

Colin