Jump to content
  • Advertisement
Sign in to follow this  
benryves

[web] JavaScript: Preventing user from leaving page

This topic is 4454 days old which is more than the 365 day threshold we allow for new replies. Please post a new topic.

If you intended to correct an error in the post then please contact us.

Recommended Posts

I need to be able to stop a user from leaving a particular page (via a confirmation dialog - this is to prevent them from switching page without saving a form first). I can catch the page after it has been unloaded via the onunload event, but by that point the page has been unloaded so I don't have the form to save any more. I hear mention of onbeforeunload, but that event doesn't get fired for me. Is what I aim to do possible?

Share this post


Link to post
Share on other sites
Advertisement
Guest Anonymous Poster
Save the form using javascript as its modified (ie. store it in a cookie as its being typed, remove it when its sucessfully submitted, and get it back on page load)
Then make the page reload if it wasn't submitted right.

Share this post


Link to post
Share on other sites
Just a hint, don't "force" a user to do anything, nothing will iritate your users more then not being able to leave if they want to. If I am in the middle of filling out a form and realize I need to go do something else, and your page stopped me from leaving, I would NEVER return. You can save the data as the user fills out the form and that way you will not loose the information but please do not trap the user.

theTroll

Share this post


Link to post
Share on other sites
Quote:
Original post by TheTroll
Just a hint, don't "force" a user to do anything, nothing will iritate your users more then not being able to leave if they want to. If I am in the middle of filling out a form and realize I need to go do something else, and your page stopped me from leaving, I would NEVER return. You can save the data as the user fills out the form and that way you will not loose the information but please do not trap the user.

theTroll


^^^ What he said.

Share this post


Link to post
Share on other sites
I don't think he's actually trapping them. Just asking them "Are you sure you want to leave?". That was my understanding at least.

Share this post


Link to post
Share on other sites
I've not discovered a way in order to do this. It seems like something a web browser should never let a script do. Think of a popup which never allows the user to close it.

Share this post


Link to post
Share on other sites
What I mean is a confirmation dialog - 'You have edited some information on this page without saving' - with an OK button to return to editing the page and a Cancel button to just skip onto whichever page you were moving to.

I've managed to get 'onbeforeunload' working in IE with the aforementioned dialog, but I'd really rather have a better cross-browser solution. I have:

var FormNeedsSaving = false;
if (window.attachEvent) window.attachEvent('onload', formSave);

window.onbeforeunload = checkFormSave;

function checkFormSave() {
if (FormNeedsSaving) return "You are leaving the page without saving changes.";
}


formSave is a function which goes through every 'control' element on any form with the 'form_save' style attached to it, and hooks in the onchange/onclick events required to set FormNeedsSaving to true (dirtying).

Share this post


Link to post
Share on other sites
If they are leaving the page via links on your site, here are some options:

1. Don't provide any links for them to leave the page via

2. Put onclick events on those links to ask them "are you sure" or similar. If you return false from an onclick event handler on an anchor, it will not follow the link.

Mark

Share this post


Link to post
Share on other sites
I'm pretty sure that the windows has an onclose event that can prevent the window from being closed. How do you feel about popups?

Share this post


Link to post
Share on other sites
Quote:
Original post by markr
2. Put onclick events on those links to ask them "are you sure" or similar. If you return false from an onclick event handler on an anchor, it will not follow the link.
I'll probably have to be that, in the end. Thanks, all!

Share this post


Link to post
Share on other sites
Sign in to follow this  

  • Advertisement
×

Important Information

By using GameDev.net, you agree to our community Guidelines, Terms of Use, and Privacy Policy.

We are the game development community.

Whether you are an indie, hobbyist, AAA developer, or just trying to learn, GameDev.net is the place for you to learn, share, and connect with the games industry. Learn more About Us or sign up!

Sign me up!