Responsive plugin not working with JQUERY MOBILE

henrywood

I am having trouble getting Responsive to properly collapse columns when using JQUERY Mobile
I have a page containing some JQUERY mobile tabs and in in two of those tabs I then have a couple of Datatables where responsive does not work.
In one of the tabs I have an IFRAME that contains an external url that also contains a Datatable where Responsive works.
All urls (both the one in the IFRAME and the two ones on tabs) have JQUERY MOBILE loaded.

Do you have any ideas as to why Responsive does not work for the tables placed inside JQUERY MOBILE tabs ?

When I say that Responsive does not work I mean that columns are not collapsed on resize and the details + does not appear in the two tables that are contained within JQUERY MOBILE tabs

Steps to reproduce:

To see it not working:

1. Go to http://109.202.137.118/installer/app.php
2. Login using 'henry.wood.dk@gmail.com' (first field) and pass 280475 (second field)
3. Click on "Installationer" tab or "Dokumenter" tab
4. Resize browser window

To see the IFRAME where responsive does work:

1. Do steps 1 and 2 from above
2. Click on "Opsætning" tab
3. Click on "Medarbejdere" and be patient for a little while...
4. After the overlay disappears and the table appears in the right side of the screen, try to resize the browser window and see Responsive working on the IFRAME on the right

Thanks !

/Henrik

allan

Hi Henrik,

You need to call the responsive.recalc() method when the table is made visible. Otherwise Responsive's calculations are all wrong since it is hidden when initialised.

Allan

henrywood

@allan Thanks ! Saved my day !
It works perfectly !

/Henrik