How to change dynamically height of one table, leaving another height unchanged
How to change dynamically height of one table, leaving another height unchanged
woocash_lw
Posts: 3Questions: 1Answers: 0
in DataTables
Hello everybody.
I would like to display two datatables on the same page.
- table example - that is scrollable and fitted to the page height (as in this example live.datatables.net/begahafe/2/edit)
- table example2 - that is scrollable and has constant height
The problem is that changes made to css :
$('#example_wrapper .dataTables_scrollBody').css("height",height+"px").css("max-height",height+"px");
refer also to the second table (example2 gets same height as table example).
Is there any way to fix it?
Regards,
Lucas
This question has an accepted answers - jump to answer
Answers
Sounds like you might want to use the ScrollResize plugin.
Kevin
Thanks for your answer Kevin.
I tried scroolResize plugin erlier, same situation.
I didn't mentioned that table with constant height (example2) is in child row of first table (example). That is the problem. Although two tables have different ID's, both get same height after window changes height.
I "sticked up" two examples here live.datatables.net/vipiyaco/1/edit
When browser window changes its size, both tables (main with id=example and child row with different id) changes height.
How to avoid this situation?
Looks like you need to make your jQuery selector more specific and only select the first
.dataTables_scrollBodyin the#example_wrapperdiv, like this:Updated example:
http://live.datatables.net/vipiyaco/2/edit
Kevin
Ok, I get it now. I'm glad you guys are on this forum
Thanks again.