Adjusting Table Height After Adding/Removing Rows

tolyan

Hello All,

First, want to say that this is a great plugin! Thanks Allan! I've been using it quite extensively. After struggling some as a newbie, I got most of the functionality down. But I do hit the wall with the following issue. I have a page where I'm displaying multiple dataTables to show a lot of diff. info in the grid-like way with ajax data loading. Some of the tables can be empty, some have expandable details. The problem that I can't seem to figure out - if you expand last row, user can't immediately see it. I can set the bScrollCollapse=false, but then all other tables that are empty will have a fixed height that take a lot of real estate on the page (I have 20+ tables). It is especially a problem if the table has only 1 row loaded and the user needs to expand details on it - you can't even notice the change. I have tried to use jQuery to resize the dataTables_scrollBody after creating the detailed row, but that didn't work and I can't even select it (it's just not there?..). Also, any changes to css result in messing up the original data for details and re-grabs the "new" values. As alternative to adjusting the height, I have tried to set bScrollCollapse=false and if the table has no data, set it to true. But I couldn't find the solution for that either. Has anyone else come across something like this? Any ideas would be appreciated.

tolyan

Is it too wordy for someone to take a shot? :) I can post code, but I'm looking mostly for ideas if there is no out-of-the box way to do it.

nibl

I have an issue where I want something like bScrollCollapse=true, but collapsible to a fixed minimum height, because one-row tables collapse too much and I can't even see a single row. It sounded to me similar to you problem, correct me if I am wrong. I haven't figured out how to do it using anything built-in. If anyone knows it would be great if you can share, thanks

allan

@tolyan - Sorry for the delay. If you can post a link to a page showing the problem that would be really useful.

@nibl - Sounds like you want a min-height on the div.dataTables_scrollBody class in CSS?

Allan

nibl

Yes that was it. I just needed to make sure i added the css rule after the table was initialized. I solved it this way:
in the dataTables constructor:
$('#myTable').dataTable( {
... somewhere here add:
"fnDrawCallback": function( oSettings ) {
$('.dataTables_scrollBody').css('min-height', '100px');
},
...
} );