How to stop page unloading?

Question

I have a page where the user needs to enter some data and click "Save" to check the changes, but my problem is that the user is trying to close the browser window or click on another link to go to another page. I need to delete all entries that the user has saved. I do it as follows

window.onbeforeunload = function() { if(confirm('Are you sure you want to navigate')) { //Invoke `enter code here`server side method } else { // return false; } } 

Everything works fine, if he clicks “Yes”, the problem occurs when he clicks “No”. Even if he clicks "No." The page unloading method is called and redirected to another page .. but I want it to remain on the same page in the same state ... could you help me with this.

Thank you and rate your answer ....

Answer 1

You cannot block the user from leaving the page. What you can do is warn them by asking if they want to leave or not.

The window.onbeforeunload event should return a string (and only a string). This line will be printed in the notification window made by the browser.

You cannot use your own notification field or block a user from exiting (or redirecting).

 window.onbeforeunload = function(){ return 'Are you sure you want to leave?'; }; 

Or using jQuery

 $(window).on('beforeunload', function(){ return 'Are you sure you want to leave?'; }); 

When the user leaves the page, you can use the onunload event to call AJAX ( async: false may be required here).

Example:

 $(window).unload(function(){ $.ajax({ url: '/path/to/page/', async: false, // this may be needed to make sure the browser doesn't // unload before this is done success: function(){ // Do something } }); }); 

NOTE. Instead, why don't you just save everything when the user is completed? Instead of saving it and then deleting if the user is not finished?

Answer 2

First of all: you cannot! It's impossible. onbeforeunload only accepts a string as a return value and closes if the user wants it.

But then think about what happens if the computer is without power and shuts down? Or is the browser closed by task manager? Or even more "realistic": the Internet connection is lost! => Then you also got invalid data states!

You are trying to solve a false problem ! Your problem is not this function, your problem is the state of your form!

Why do you need some kind of function? Do you save the data before it clicks on the save? Then do not! Or make sure you have another query that detects incomplete data in your database and deletes it after a timeout!

Answer 3

onbeforeunload only accepts a string as a return value. This line will be displayed by the browser with the ability to stay on the page or leave it. But you can do it.

Answer 4

You can use something like this, just call the following function on your page

 function noBack() { window.onbeforeunload = function(){window.history.forward()} } 

this disables the back button if window.history clean, otherwise it only works for the first time.