Using TableTools with multiple Bootstrap Tabs

quytennis

I have multiple tabs using Boostrap 2.0.2 tabs (and DataTables 1.9.0) with a datable under each tab.

The problem is that the Table Tools that appear for each table in each tab don't work - only the buttons on the first visible table work.
If I click on other tabs, the Table Tool buttons are inactive and don't work.

How can I get this to work? I know there have been multiple discussions on this but wanted to focus on using Bootstrap tabs and see if there was a solution.

quytennis

I've just figured this out using advice from this thread:

http://www.datatables.net/forums/discussion/5859/tabletool-problem-when-hiding-datatable_wrapper/p1

Here is the Javascript snippet I used with "tab2" being the ID of the 2nd bootstrap tab I have on my page on "datatable2" being the ID of the table.

[code]
$('a[id="tab2"]').on('shown', function (e) {
var TableTools1 = TableTools.fnGetInstance( 'datatable2' );
if ( TableTools1 != null && TableTools1.fnResizeRequired() )
{
TableTools1.fnResizeButtons();
}
});
[/code]