Calculating Table Width

novusweb

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.

allan

Hi novusweb,

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

novusweb

Thanks! Sorry I missed that. I think I assumed that would negate autosizing the columns, not the table.

Works like a charm!