Question

I’m currently using the jquery-form-observe plugin which uses onbeforeunload to prompt the user about “unsaved” changes.

But I have a scenario where I need to trigger this on a button click: the button click ultimately leads to the page changing, but I want to prompt the user before they start the process that the button click kicks off…

So is there a way to trigger onbeforeunload through jQuery or otherwise?

Answer 1

I don’t know if there is a direct way to do this, but you could always emulate the browser’s confirmation box yourself. Here’s a simple function I cooked up based on the specs at MSDN:

function triggerBeforeUnload() {
  var event = {};
  handler(event);

  if (typeof event.returnValue == 'undefined' ||
      confirm('Are you sure you want to navigate away from this page?\n\n' + event.returnValue + '\n\nPress OK to continue, or Cancel to stay on the current page.')) {
    // Continue with page unload
  } else {
    // Cancel page unload
  }
}

Edit: In jquery.formobserver.js, right after the definition of function beforeunload(e) { ... }, add this line:

handler = beforeunload;

Note the change in the original code: window.onbeforeunload has been replaced by handler.