JQuery Mobile popup with history=false autocloses

Question

I'm trying to show a popup but the popup disappears automatically, without the history=false the popup stays visible but then on closing the popup the browser back action is triggered

<div data-role="page" id="indexpage">
    <div data-role="popup" data-history="false" id="appPopup">test popup</div>
    <script>
    $("#indexpage").on("pageshow", function () {
        $("#appPopup").popup("open");
    });
    </script>
</div>

Check what happens here: http://jsfiddle.net/francisdb/ThtfZ/

Any idea on how to fix this?

seems to work on firefox but broken on chrome / safari – Somatik Apr 05 '13 at 09:27 — Somatik, Apr 05 '13 at 09:27

Gajotres · Answer 1 · 2013-04-05T09:50:25.293

8

Working example: http://jsfiddle.net/Gajotres/2EL5R/

$("#indexpage").on("pageshow", function () {
    var popup = setInterval(function(){
        $("#appPopup").popup("open");
        clearInterval(popup);
    },1);
});

Webkit browsers hate popup open, so setinterval needs to be used to trigger it. Same thing goes for a few other jQuery Mobile functionalities.

edited Apr 05 '13 at 09:50

answered Apr 05 '13 at 09:28

Gajotres

57,309
16
102
130

Do you know of a ticket for this issue? – Somatik Apr 05 '13 at 09:31
I don't think there's one. This problem first occurred when popup was introduced for the first time. Like table widget, popup is probably worst jQM plugin. It has numerous problems and errors, from positioning not working correctly up to really bad documentation. – Gajotres Apr 05 '13 at 09:38
1

For it to be fixed in my app I need to set the interval to 1000, also you should call clearInterval after it has run – Somatik Apr 05 '13 at 09:46
Whatever makes it work for you. And you are correct I forgot clear interval. I will update my answer. – Gajotres Apr 05 '13 at 09:48
no idea, anyway this is fragile code and I would rather see a different workaround or a link to a proper bug report that confirms what the cause of this problem is – Somatik Apr 05 '13 at 10:13
Good luck then, I never found any other solution. Msg me if you find one. – Gajotres Apr 05 '13 at 11:18
I run into the same problem. It worked on desktop chrome mobile emulator, but on a real device it dispeared imediatelly. Putting it to 1000 fixed it. – merlin May 28 '15 at 21:24

score 0 · Answer 2 · answered May 29 '15 at 19:42

I had the same issue looking to solve this now for several hours. The solution suggested by Gajotres seamed to work first, but in the end did not on all devices. I tested with several android, desktop and iOS Browsers.

The problem in my case was an AdSense Banner, that was hidden by the popup.

Google AdSense will notice that the banner is no longer visible and close the popup upon loading of the AdSense banner. Removed the banner, and it workes now perfectly. Other AdSense banners on the page, which are not hidden by the popup will not affect the popup functionality.

JQuery Mobile popup with history=false autocloses

2 Answers2

Linked