We Keep Coding

Unsaved changes message alert on browser back button in javascript

I am working on the functionality to prompt a confirmation message, if user has unsaved changes on webpage. BeforeUnload function is working fine for browser refresh or close, but I want to implement same functionality using back button of browser for which I am using confirm dialog box . The cancel button is not working as expected.. can anyone please help
window.addEventListener('popstate', function (event) {
if (!confirm("are you sure")) {
return false;
}
});

JS Function inside a click for a button is being called twice

Hi I have the following piece of code that is giving me weird behaviour
$("#cont_btn").click(function () {
$("#cont_btn").attr('disabled', 'disabled');
selRowIds = $("#CodeGrid").jqGrid('getGridParam', 'selarrrow');
rowsToJson(selRowIds);
//return false;
});
The button cont_btn is a button on a bootstrap 2 modal. It contains a continue button and a close button.
If I select the close button or click outside the modal to dismiss it, and then re-open the modal the function will get called twice.
I have tried using
.one('click', function() { ... }
and I have put break points on the line of
$("#cont_btn").click(...
click is not getting called twice. During my debugging I'm finding that the script re enters on the line of
$("#cont_btn").attr('disabled', 'disabled');
On the page load I see that the line of
$("#cont_btn").click(function () {
Is hit but the code does not enter the function it will skip to the close button. I presume this is the listener for both buttons being initialized ?
Googling this has suggested checking that the Script isn't called twice and using return false, but nothing has worked.
Any help is appreciated.

The event handler is inside the function that opens the modal, so everytime the modal is opened, the event handler is bound once more.

The mouseEvent in a function fires twice if call again?

The problem is I would like to fire only once when the mouseevent function is triggered, e.g.
$(document).ready(function() {
$("#menu").click(function(){
$('#menu_div').show();
menu_function();
});
$("#menu_close").click(function(){
$('#menu_div').hide();
});
});
function menu_function(){
$(".select_li").live(
"click",
function() {
alert("test");
}
);
}
The example has two objects, menu and menu close; when the menu press, the ui box is shown, and run the menu_function , which fires an alert test message. The problem is when the menu_close is clicked and box closed, and open it again, the alert test will fire twice. I observe that the times of div box close and open again is the same as the fire times of the function, how can I fix it?
If I would like not using unbind, are there any better solution?

Your menu_function() is NOT just firing an alert test message - it is adding a live click listener to everything in the DOM that has a class of "select_li" that fires a test alert. This means that every time you click on #menu you are adding ANOTHER listener to .select_li - so if you click #menu 10x, you should have 10 listeners for each click of .select_li.
If you are truly trying to JUST show an alert when you click on #menu, your menu_function() should only look like this:
function menu_function() {
alert("test");
}

Is there a way to capture the alert ok button click event?

Is there a way to capture the alert ok button click event? In jQuery?

The alert() function is synchronous and you can't verify what was clicked (it does not return anything), so the code below the call will be executed after it is closed (ok or close button). The alert is not used to gain user input. It is an alert, a message to the user. If you need to check what the user want, you should use confirm(). Note that the function name tells its purpose like alert.
Something like:
// if the ok button is clicked, result will be true (boolean)
var result = confirm( "Do you want to do this?" );
if ( result ) {
// the user clicked ok
} else {
// the user clicked cancel or closed the confirm dialog.
}

Alert is a blocking function, means, if you don't close it, the code below will not execute.
So you don't have to capture the alert close event, just write down the code below that alert, when alert window will be closed the code below will be executed automatically.
See example below:
alert("Close Me");
// Write down the code here, which will executed only after the alert close
console.log("This code is executed after alert")

Disclaimer: This is a very bad thing to do.
Technically you could hook into it with this code:
window.alert = function(al, $){
return function(msg) {
al(msg);
$(window).trigger("okbuttonclicked");
};
}(window.alert, window.jQuery);
$(window).on("okbuttonclicked", function() {
console.log("you clicked ok");
});
alert("something");
​
Demo: http://jsfiddle.net/W4d7J/1/

There is no event for the window.alert(). Basically the next line after it is called when they click ok. I am not sure why you would need to listen for it.

I tried this in a site I created and it worked perfectly :
<< Back

You could use JAlert and assign a click handler to the ok button.
Something like
jAlert("Alert message goes here.");
$('#popup_ok').bind('click',function(){
//Do operation after clicking ok button.
function_do_operation();
});

In a browser extension, how do I click a specific button of an alert?

So...
I need to click [Stay on this page] automatically in such a prompt:
Confirm navigation: [Leave this page] [Stay on this page]
The code that invokes this is
$(window).bind('beforeunload', function() {
return 'Leave page?';
//Click prompt code goes here.
$(window).unbind();
});
If I take away return 'Leave page?';
then the iframed page overrides the top frame and the user is struck with an unknown site, maybe there's another way to do this?

Actually that would hook into the onbeforeunload event:
$(window).bind('beforeunload', function() {
return 'Leave page?';
});

Instead of automatically clicking it, check if you can automatically disable window.onbeforeunload event handlers. That's most likely much easier than trying to send a click to a specific button in a modal window anyway.

I agree with Thiefmaster.
Alternative is to replace the alert, prompt or confirm if that is what is used:
window.confirm=function() {
// here you do what you want
}