Overriding native Javascript alert function to capture onbeforeunload alerts - javascript

My question is not about how to override the alert function and then decorate it as you want. My problem is that when you override the alert function like this:
window.alert = function(str){console.log('alert is called: '+ str);}
For a page with a registered handler for onbeforeunload event like this:
window.onbeforeunload= function(){return 'bye!';}
It is supposed to pop up an alert box with the string "bye" before leaving a page and you could catch it using your custom alert function. But the problem is that your custom alert function won't be called in this case. It looks like the browser is calling another alert function to put your string there. How can I override that alert function?

According to MSDN
Remarks When a string is assigned to the returnValue property of
window.event, a dialog box appears that gives users the option to stay
on the current document and retain the string that was assigned to it.
The default statement that appears in the dialog box, "Are you sure
you want to navigate away from this page? ... Press OK to continue, or
Cancel to stay on the current page.", cannot be removed or altered.
this is not an alert, it is a confirm box which browser provides and we can not alter that. please find the link https://msdn.microsoft.com/en-us/library/ms536907(VS.85).aspx

Related

How to get the "Leave site? Changes that you made may not be saved" when trying to close a window with a populated form

I have a form that when filled in, I can exit the window without being given a warning (I'm using Chrome).
How can I ensure I get a warning before exiting? Is there a Django setting for this?
You need to supply a function returning a string to onbeforeunload of the window or the document body in order to trigger the "Leave site" popup.
window.onbeforeunload = () => '';
Click to trigger
The event is called beforeunload, so you can assign a function to window.onbeforeunload

How to set breakpoint in Firebug on alert()?

I have a very complex website and I know that somewhere is an alert() with a description. Is there a way to set a breakpoint on the alert() call? The HTML is generated, so I cannot just grep for the message.
You can use the console to replace the alert function:
window.alert = function() { debugger; };
Firebug's Script panel allows you to search for code throughout all your JavaScript sources.
So you can simply search for alert( or search for the message that the alert box shows and set a breakpoint on the line where it's called.
Another way is to use the Break On Next button ( ) to stop at the next JavaScript statement that gets executed. So, click the button and then do the action that causes the alert box to be displaced.
Note: This only works if there are no other event handlers called before the event showing the alert box.

Mobile browser Back button event handling

When i click Mobile browser back button, It should say the confirmation box like
"Are you wants to leave this page"
If the user click "OK" I need to trigger some function.
It's working fine. But when i click "Cancel" it's not staying on the same page. I tried the below code. But am not able to success.
var unloadEvent = function (e) {
var confirmationMessage = "Are you want to leave this page";
(e || window.event).returnValue = confirmationMessage;
if(confirm(confirmationMessage)) {
//some JS function
} else {
return false;
}
};
window.addEventListener("beforeunload", unloadEvent);
Please help me to solve this issue.
Thanks
You can't modify the default dialogue for onbeforeunload, so your best bet may be to work with it.
window.onbeforeunload = function() {
//Do some other stuff here..
return 'You have unsaved changes!';
}
Here's a reference to this from Microsoft:
When a string is assigned to the returnValue property of window.event, a dialog box appears that gives users the option to stay on the current page and retain the string that was assigned to it. The default statement that appears in the dialog box, "Are you sure you want to navigate away from this page? ... Press OK to continue, or Cancel to stay on the current page.", cannot be removed or altered.
The problem seems to be:
When onbeforeunload is called, it will take the return value of the handler as window.event.returnValue.
It will then parse the return value as a string (unless it is null).
Since false is parsed as a string, the dialogue box will fire, which will then pass an appropriate true/false.
The result is, there doesn't seem to be a way of assigning false to onbeforeunload to prevent it from the default dialogue.
Additional notes on jQuery:
Setting the event in jQuery may be problematic, as that allows other onbeforeunload events to occur as well. If you wish only for your unload event to occur I'd stick to plain ol' JavaScript for it.
jQuery doesn't have a shortcut for onbeforeunload so you'd have to use the generic bind syntax.
$(window).bind('beforeunload', function() {} );
This answer is suggested by Owen on the question: override onbeforeunload
Thanks Owen.

Why is this Javascript code executed twice?

When a link is clicked on my site the Javascript code below is executed, if the condition is true it will display an alert dialog. When the user selects the OK button in the alert dialog the block of code is executed again.
So the alert closes, the code below is executed for a second time and the alert dialog is displayed again. When the used selects the OK button on the alert dialog the second time the alert dialog is closed for good.
How can I prevent the code below being executed twice?
$("#my-button").click(function() {
var login = someVar;
if(!someVar || someVar == ''){
$('.close-reveal-modal').click();
alert(myMessage);
}
});
Check if you are adding the click handler twice, maybe that is what is causing that behavior.
In that case remove one of them.
From the very limited information that's provided, this is all that I can think of as going wrong:
$('.close-reveal-modal').click();
This piece of code should have some kind of function which is executed to display a similar Alert Box.
A complete code would be more useful for a complete answer!
Might not have anything to do with that code at all. Check to make sure that your javascript file isn't being called twice in the same app.
From what we have here, I'm guessing that your .close-reveal-modal element is in #my-button (or is the same html node).
When you trigger the click on it (by $('.close-reveal-modal').click();), it also trigger the click on its parent node, so on #my-button too.
I can be wrong, we need the HTML part (a fiddle would be great) to validate my theory.

Remove a confirm() dialog via javascript/jquery

In a javascript function, I do this for quick prototyping:
if(confirm("are you sure you want to do this")) {
// do something
} else {
// do something else
}
If I get a specific event over a websocket, I want to remove this dialog in javascript/jquery. Any ideas how to do that? Is there a DOM id or something for that? Extra-Points if not even the else-block is executed when removing the dialog :)
You can't. All javascript execution is halted while a confirm, alert, or prompt is displayed.
Dialog boxes are modal windows - they prevent the user from accessing
the rest of the program's interface until the dialog box is closed.
For this reason, you should not overuse any function that creates a
dialog box (or modal window).
https://developer.mozilla.org/en/DOM/window.confirm

Categories

Resources