Calculating Table Width
Calculating Table Width
I am using Datatables within a JQuery Tabs UI. It is used in the initial panel view when the page is loaded.
It appears that DT calculates the ideal table width and adds a style="width: XXXpx" value to the table tag. That's fine, except that when I click on another tab, then return to the original tab, the table is resized to a minimum size, squeezing the layout, instead of keeping the original width of the table.
The DT is loaded when the tab is clicked by loading a dynamic page into the panel content.
I've been looking for a means of overriding this style addition, but haven't had any success.
Do you have any ideas as to what I can do to fix this? I can provide you with a URL to illustrate, but only privately.
Thanks.
It appears that DT calculates the ideal table width and adds a style="width: XXXpx" value to the table tag. That's fine, except that when I click on another tab, then return to the original tab, the table is resized to a minimum size, squeezing the layout, instead of keeping the original width of the table.
The DT is loaded when the tab is clicked by loading a dynamic page into the panel content.
I've been looking for a means of overriding this style addition, but haven't had any success.
Do you have any ideas as to what I can do to fix this? I can provide you with a URL to illustrate, but only privately.
Thanks.
This discussion has been closed.
Replies
Is my understanding correct that for each tab click you re-initialise DataTables? It's odd that it would pick a different size the second time around.
Either way, DataTables auto width calculation can be disabled using the 'bAutoWidth' initialisation parameter (set it to false) - see http://datatables.net/usage#bAutoWidth .
One trick to watch when disabling this is that a user changing pages can cause the column width to jump around a little. You can add a class (or a style) to your columns to stop this.
Hope this does the trick,
Allan
Works like a charm!