CODEWITHSUNDEEP
javascriptalertconfirm
Airikr
Airikr

Reputation: 6436

"Confirm navigation" alertbox

I'm looking for an function that shows a alertbox when the visitor is trying to leave the page when he or she haven't finished the form. I have imported an image to show what I mean. Translation: title = "Confirm navigation", content = "Do you want to leave this page?", button1 = "Leave this page", button2 = "Stay on this page".

Facebook uses this alertbox when you want to go back one page when you have for example not finished an PM to someone.

enter image description here

How can I accomplish something like this?

Thanks in advance.

Upvotes: 2

Views: 7287

Answers (1)

glortho
glortho

Reputation: 13200

Use window.onbeforeunload in conjunction with a flag that gets set when a change is made to a form field.

For example:

var changed_flag = 0; // change in an onchange event or whatever, something like the below

document.getElementById('form_field').onchange = function() {
  changed_flag = 1;
};

window.onbeforeunload = function() {
  if ( changed_flag ) {
    return 'You have unsubmitted changes.'
  }
};

Upvotes: 4

Related Questions