Reputation: 359
I want closed dialog open page2 not go back page1.
I tried bind pagehide
event on dialog like this, but it first goes back page1 then open page2, not direct open page2.
$("#dialog").bind("pagehide", function() {
$.mobile.changePage("#page2");
});
<div data-role="page" id="page1">
<div data-role="content">
page1
<a href="#dialog" data-iconpos="notext" data-transition="slide">open dialog</a>
<a href="#page2" data-iconpos="notext" data-transition="slide">open page2</a>
</div>
</div>
<div data-role="page" id="page2">
<div data-role="content">page2</div>
<a href="#page1" data-iconpos="notext" data-transition="slide">open page1</a>
</div>
<div data-role="dialog" id="dialog">
<div data-role="header"><h1>dialog</h1></div>
<div>Dialog</div>
</div>
Upvotes: 0
Views: 93
Reputation: 24738
In jQM 1.4 you define a page to look like a dialog by assigning data-dialog="true"
:
<div data-dialog="true" id="dialog">
Then to redirect on close, you could handle it this way:
$(document).on("pagecreate", "#page1", function () {
$("body").on("pagecontainerbeforetransition", function (event, ui) {
var oldpageid = $("body").pagecontainer("getActivePage").prop("id");
var newpageid = ui.toPage.prop("id");
if (oldpageid == "dialog" && newpageid == "page1") {
$("body").pagecontainer("change", "#page2", {"transition": "slide"});
return false;
}
});
});
Basically catch the page before transition, see if we are on dialog and are going to page1, if so, redirect to page2.
Upvotes: 2