Why is this Javascript code executed twice? - javascript

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.

Related

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.

Hiding elements within on()

I am trying to make it so when my "cancel deletion" link is clicked, the links that are confirming whether to delete or not disappear and the original delete button reappears. In essence I am trying to make a confirmation window, but have it occur inside the current document rather than as a popup box.
All my code works except for this bit:
$(document).on("click",".delete_button",function(){
$(".delete_button").hide();
$(".confirm_links").show();
return false;
});
When I click the delete_button link, the confirm_links is shown but delete_button fails to hide. I think delete_button is not hiding because I am passing it as a parameter in .on() and then trying to modify it within the handler I am passing. I think that I need some special syntax to reference, maybe something akin to self, but I am unsure where to go from here. Any advice greatly appreciated. Kthnx
JSfiddle: http://jsfiddle.net/Vvckp/1/

Wait for click in loop

Before even starting, I know there already has been a thread about this, but unfortunately it did not help me at all.
So here is my problem, I have a loop written in JavaScript and at the end of it is a button click event. The event is related to a button situated inside a popup window.
for(var i=0; i<value; i++){
[...]
//some code here
[...]
//opens the window
windowButton.addEventListener('click', function(){
//code
});
//here I would like for it to continue once the click has been triggered
}
Unfortunately, it doesn't wait for the click.
Like said in the similar post, incrementing the variable i inside the function doesn't work, or even using a global variable. And the suggested answers are not what I am looking for.
[EDIT]
Okay, so I'm going to add some information to be more precise. I need to create a form. But it also needs to be able to parse a file containing all the information, and to be able to fill it. For each line of information of the file, so each time the form is completely filled, a window needs to open and wait for the validate button situated inside it.
Si I am hoping I made myself clear enough.
[/EDIT]
Thank you in advance for any reponse
There is no way to pause a function in JavaScript. You need to completely change your approach.
Move the code that you currently run each time you go around the loop into a separate function.
Create a variable outside that function.
Each time the function is called, increment that variable.
If the variable is "too big" return from the function before doing anything.
Assign that function as your click event handler.

jQuery blur event firing on load, instead of when expected

I'm working on a project which will require some form validation, which I'm using jQuery for.
There's a field where a user will enter their email, and once they have filled out that field I want to check it.
Currently, the first part of my JavaScript looks like this:
$(window).load(function()
{
var email = $("#registerEmail");
email.blur(alert("stuff")); //will call a validation function
Right now, I get the "stuff" alert as soon as the page loads. My understanding was that blur would only fire once an element gained focus and then lost it -- am I misunderstanding this? Shouldn't this alert only execute once a user clicks or types in the email form and then clicks or types somewhere else, rather than immediately when the page loads?
You are actually executing the alert function when you do it that way. You need to provide a function that can be called later. Do
email.blur(function () {
alert("stuff");
});
$(document).ready(function(){
$("#registerEmail").blur(function(){
//your alert here
});
});

javascript commands not all firing

I have a very simple JavaScript function:
function insertPost()
{
document.postsong.submit()
parent.document.getElementById('postSongButton').disabled = true;
}
Both commands in it work but only the first one will fire. This is true when they switch places also. Only the first one will fire...
document.postsong.submit()
Submits the form, takes focus away from the function, function ends there
parent.document.getElementById('postSongButton').disabled = true;
Disables the button, so perhaps it is that there is then nothing to submit the form.
Not too sure if disabling the form button would stop the event from bubbling, but I suspect that the nature of these two lines will lead you to separating them, and having the second one in another event handler.
Hope this points you in the right direction.
EDIT: On further inspection, I found that the real source of the problem is the line:
document.postsong.submit()
Here are the results of my tests in different browsers. If the line previous to the submit() is "button.disable = true", and the button type="submit":
Firefox disables the button and submits the form.
Chrome disables the button, but does not submit.
IE does not disable the button, but it does submit the form.
This explains the behavior you have been experiencing. Having parent before getElementById does not hurt anything, but it is not necessary. Change the code in your insertPost() function to this:
function insertPost(){
document.getElementById("postSongButton").disabled = true;
document.forms["postSong"].submit();
}
Did you check the casing of the html element?
on click of the button you are calling the funcion insertPost().so what you have to do first disabled the button and then submit the form.one think i didnt understand why are using parent of object.
function insertPost()
{
parent.document.getElementById('postSongButton').disabled = true;
document.postsong.submit();
}
You are using parent.document.getElementById(...
Just check if you are referring to the button correctly. i.e. if the parent reference you are using is correct. i.e if the button is in same page as the form or in the parent.
And yes, first you have to disable the button and then trigger the submit action for the form. When you do it the other way, you might end up navigating away to a different page and the disabling line may never execute.
But, since you said, disabling doesn't work for you at all, I thought if you were using wrong reference. Did it give any javascript errors for you when you tried to disable it?

Categories

Resources