Resonsive table is not working iusing tabs

studio11productions

I setup two table using tabs, and both tables work perfect in the full browser but on mobile first one works great but second is not hiding columns using responsive
If I set them up separately they both work fine in responsive design
or
If I swap the tables the first tab works fine but when I click on the second tab it's not

tangerine

Please provide a link to your page or to a test case showing the issue, in accordance with forum rules.
https://datatables.net/forums/discussion/12899/post-test-cases-when-asking-for-help-please-read#latest

kthorngren

Sounds like you might need to use columns.adjust() and api responsive.recalc() when the tab is shown. You can see an example of columns.adjust() with Bootstrap tabs in this example:
https://datatables.net/examples/api/tabs_and_scrolling.html

Kevin

studio11productions

Here is the link
https://cf11-7.studio11productions.com//_widgets/DataTables/test.cfm

kthorngren

Looks like you might need to add style="width:100%" to the table tag as shown in this example:
https://datatables.net/examples/basic_init/flexible_width.html

Kevin

studio11productions

I did that and nothing
same problem

colin

@tangerine said, We're happy to take a look, but as per the forum rules, please link to a test case - a test case that replicates the issue will ensure you'll get a quick and accurate response. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

studio11productions

here it is THANK YOU

http://live.datatables.net/yimahaco/1/edit?html,js,output

allan

Hi,

Per Kevin's comment above you need to call columns.adjust() when the tab is made visible. See this example for how that can be done with Bootstrap tabs.

Allan