JQuery Mobile popup with history=false autocloses

Somatik picture Somatik · Apr 5, 2013 · Viewed 8.3k times · Source

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?

Answer

Gajotres picture Gajotres · Apr 5, 2013

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.