PDA

View Full Version : Prevent page change



gnube
4 Apr 2012, 10:52 PM
I am interested in being able to notify the user that the page is going to be closed/refreshed so that they can cancel out of the event if they want.

I am not interseted in a conversation about whether this is a good idea or not - lol - I want to present the user with the option of staying on the page for cases such as Mouse motions over grids being interpreted by Safari as web page navigation. I have implemented sessions and can control the state of my reloads if my app page is lost but it is still annoying some users when the page is switched.

I have implemented the following in my MVC application script - it catches the event but fails to prevent the page change. If anyone has implemented a listener or can see the problem with my failed attempt I would love to see how to do it right.


Ext.EventManager.on(window, 'beforeunload', function(e) {
message = 'Are you sure you want to leave this page?';
alert('MyApp.js: FAIL '+message);
e = e || window.event;
if(e){
e.returnValue = message;
}
return message;
});

scottmartin
5 Apr 2012, 7:12 AM
I have not tried this myself, perhaps someone else can offer more details. I did find this post that may help:
http://stackoverflow.com/questions/155739/detecting-unsaved-changes-using-javascript

Regards,
Scott.

gnube
5 Apr 2012, 5:53 PM
Thanks Scott - I have just removed the Ext.Manager and replaced with plain Javascript, this lets Safari block the page change at least. Safari changes the contents of its address box and keeps an activity animation running in the page tab - can't win sometimes. Reported that to Apple.

i.e.


window.onbeforeunload = function(e) {
message = "Your session may automatically timeout.";
e = e || window.event;
if (e) {
e.returnValue = message;
}
// For Safari
return message;
}