0

My post submits the form and displays the dialog after it successfully submits everything. I am curious as how to change the event when this dialog is closed out by the X in the top corner to close something else as well such as another dialog.

$.post("test.php", $("#payment-form").serialize(),function(){ 
   $.mobile.changePage('#successfulPurchase');
}); 

I want to do

$("#subscribePage").dialog('close');

when the successfulPurchase dialog is closed out

Omar
  • 32,302
  • 9
  • 69
  • 112
mpiazza031
  • 67
  • 1
  • 10
  • Have you searched on jquery-mobile api to see which event you've got? – Marco Mura Nov 18 '14 at 14:14
  • 2
    The popup has an afterclose event: http://api.jquerymobile.com/popup/#event-afterclose – ezanker Nov 18 '14 at 14:15
  • So you think I should change my dialog to a popup and just use that? Because that sounds way easier – mpiazza031 Nov 18 '14 at 14:17
  • @pschemm031, it is not 100% clear from your question what you are trying to do. The popup widget is generally the way to go; however, jQM only allows one at a time to be open. So if you need 2 open at the same time, popup will not work. For that you might want to look at SimpleDialog2: http://dev.jtsage.com/jQM-SimpleDialog/demos2/ – ezanker Nov 18 '14 at 14:55
  • I have a dialog open which has a payment form. When submitted and successful, I need a thank you message to come up in a popup or dialog.But when the user closes out the thank you message I need both the new message to close along with the form dialog. – mpiazza031 Nov 18 '14 at 15:01
  • @pschemm031, if you use a popup for both, you would have to close the payment popup and then show the thank you popup. Note that jQM dialogs are deprecated and will go away in v1.5. SimpleDialog2 supports chained popups, see this article I wrote: http://jqmtricks.wordpress.com/2014/05/16/chained-popups-with-simpledialog2/. you can handle the close with the callbackClose option. – ezanker Nov 18 '14 at 15:08
  • to close dialog `$.mobile.back()` or change page. Dialog emits `pagecontainerhide` when it's closed. – Omar Nov 18 '14 at 16:05
  • I have $.mobile.changePage to the success dialog, but the problem is when the user closes that out with the X it brings them back to the form that was submitted, when I need the dialog to close as well. So the user is back to the main page – mpiazza031 Nov 18 '14 at 16:13
  • http://stackoverflow.com/a/26983272/1771795 just change `data.prevPage[0].id` to `data.prevPage.hasClass("ui-dialog")` and of course `#mainScreen` to `#your homepage id`. – Omar Nov 18 '14 at 16:20

1 Answers1

1

If you want to redirect a user when a dialog is close, use pagecontainerbeforechange event to alter toPage with a new target page. To determine whether the navigation direction is back, check value of options.direction. prevPage is a jQuery object of previous page/dialog.

$(document).on("pagecontainerbeforechange", function (e, data) {
    if ( typeof data.toPage == "string" && data.options.direction == "back" && data.prevPage.hasClass("ui-dialog") ) {
        data.toPage = "#homepage"; /* redirect to homepage */
    }
});
Omar
  • 32,302
  • 9
  • 69
  • 112