0

I am wanting to intercept anchor clicks and show a prompt if text has changed and not been submitted in a form using zebra-dialog. For any other form of page leaving I use the built in browser unload dialog.

Here is the code I have so far, the dialog shows, but no matter which option you click you end up staying on the page.

$("body").on("mousedown",'a', function(e) {

    if(inputhaschanged) {
        return $.Zebra_Dialog("You haven't submitted your comment. Do you wish to leave?", {'type':'question','title':'','buttons':  [
                {caption: 'No', callback: function() {  }},
                {caption: 'Yes', callback: function() { return true; }}]
        });
    }

});
Martin
  • 795
  • 1
  • 12
  • 31
  • 2
    looks like the `Zebra_Dialog` is an async method.. so you can't do it like this... you need to manually do a page redirect on the `Yes` handler – Arun P Johny Jan 14 '14 at 02:35
  • Thanks @ArunPJohny, do you mean something like this in the Yes callback? window.location.href = $(this).attr("href"); – Martin Jan 14 '14 at 03:00

1 Answers1

0

One solution for this is you disable default behavior of all link on your page and then check for modification. Also you need to call event window.onbeforeunload to prevent other navigation method. Reference: how to stop page redirect How do you prevent a webpage from navigating away in JavaScript?

Community
  • 1
  • 1
James
  • 13,571
  • 6
  • 61
  • 83