I am working on this page: .php
After someone has entered their order details and click "Let's Go!" the order information is captured, displayed for them to check and then a "Pay Now!" button appears at the bottom (try it, you don't have to pay anything, just so you can see what I mean)
I don't want to hinder anyone leaving the page BEFORE they click the Let's Go button, but if they have already clicked "Let's Go!" (ie. placed an order) but have NOT yet clicked "Pay Now!" I want to be able to check with them "Do you really want to leave? If you leave without paying, your order will be cancelled!"
Before I get into the plication of making sure it only functions when an order has already been placed, I tried just a very basic onbeforeunload setup just to see if the browser would support it. I seem to get sporadic support for this function in Safari, generally it doesn't work, but very occasionally it does, and in Chrome it just doesn't work at all.
Any help or advice anyone can offer would be gratefully received!
Thanks,
Phil
P.S. For your info, I have removed all onbeforeunload functionality from the live page for now, because I don't want to annoy visitors until I've got it right and it does exactly what I want.
UPDATE: Here is the latest attempt:
var needToConfirm = true;
window.onbeforeunload = confirmExit;
function confirmExit() {
if (needToConfirm)
return "Message";
};
I am working on this page: http://www.weloveflyers.co.uk/order.php
After someone has entered their order details and click "Let's Go!" the order information is captured, displayed for them to check and then a "Pay Now!" button appears at the bottom (try it, you don't have to pay anything, just so you can see what I mean)
I don't want to hinder anyone leaving the page BEFORE they click the Let's Go button, but if they have already clicked "Let's Go!" (ie. placed an order) but have NOT yet clicked "Pay Now!" I want to be able to check with them "Do you really want to leave? If you leave without paying, your order will be cancelled!"
Before I get into the plication of making sure it only functions when an order has already been placed, I tried just a very basic onbeforeunload setup just to see if the browser would support it. I seem to get sporadic support for this function in Safari, generally it doesn't work, but very occasionally it does, and in Chrome it just doesn't work at all.
Any help or advice anyone can offer would be gratefully received!
Thanks,
Phil
P.S. For your info, I have removed all onbeforeunload functionality from the live page for now, because I don't want to annoy visitors until I've got it right and it does exactly what I want.
UPDATE: Here is the latest attempt:
var needToConfirm = true;
window.onbeforeunload = confirmExit;
function confirmExit() {
if (needToConfirm)
return "Message";
};
Share
Improve this question
edited Jul 28, 2011 at 3:07
RobG
148k32 gold badges179 silver badges214 bronze badges
asked Jul 28, 2011 at 2:09
Philip OsbornePhilip Osborne
511 silver badge2 bronze badges
3
- Can you please post the code that you're using to bind the onbeforeunload event? – rkaregaran Commented Jul 28, 2011 at 2:30
-
My latest attempt was using this:
code
<script language="JavaScript"> var needToConfirm = true; window.onbeforeunload = confirmExit; function confirmExit() { if (needToConfirm) return "Message"; }; </script>/code
While experimenting, I did try setting needToConfirm to false, using the "Let's Go!" button to set it to True, and then using the "Pay Now" button to set it back to False as a way of triggering it only at the appropriate moment. – Philip Osborne Commented Jul 28, 2011 at 2:48 - Your lattest attempt works fine for me in Chrome. – serg Commented Jul 28, 2011 at 4:19
1 Answer
Reset to default 6As per the MDN documentation, I just tried the following in Chrome 11 (and 13) and Safari 5 on OS X, and in Chrome 14 on Windows 7, and it works fine for me (as does your code above!):
window.onbeforeunload = function (e) {
e = e || window.event;
// For IE and Firefox prior to version 4
if (e) {
e.returnValue = 'Any string';
}
// For Safari
return 'Any string';
};
What happens if you use the code above in your page, exactly as it is?
What versions of Chrome and Safari are you using?