Jquery click code being called multiple times

Question

I tried adding my code into a fiddle and it works fine in there so please, try to analyze it straight on my site. Here is the page: http://cacharro.ole32.com/shopping/

if you go to groceries.js, at line 39 there is the code for the clic event on the #addNewSection image.

then in the page you click in the big gree + buton, a formulary will pop up, and click again in the big green + symbol. You'll notice that the code inside the .click() function is called more than once..

does anyone knows why ??

EDIT:

I found the source of my error. Y added the hooking to the event in a function called init, something like:

function init() {
     $("#addNewSection").click( function(e){
          newSectionButtonClicked();
     });
}

and added a call in the $(function() .... BUT I also call this init() from other sites so everytime I call it a new instance of the function is hooked to the click event!! Is there a way to hook on the event only if we are not hooked already????

for doing action only once you can use boolean variable var isInitialize = false; and check it function init(){ if (isInitialize) return; isInitialize = true; — AppLend
– AppLend, Commented Feb 25, 2014 at 8:31

Alberto Fecchi · Accepted Answer · 2014-02-25 08:17:01Z

2

You should call init() function only 1 time, or remove the assignment of click event inside this function and put in in a function that will be called only one time, for example:

$("#addNewSection").click( function(e){
  newSectionButtonClicked();
});

this function is called every time you call the init() function, so this event will be trigged one more time for every init() you call.

You should call this registration only one time

answered Feb 25, 2014 at 8:17

Alberto Fecchi

3,5161 gold badge20 silver badges34 bronze badges

Sign up to request clarification or add additional context in comments.

5 Comments

Marcus Over a year ago

That was my first guess as well, but using a breakpoint shows that the init() is run just once

Alberto Fecchi Over a year ago

i've put a lot of breakpoint and i pass through init() more times, i'll check again

javirs Over a year ago

this is definitelly what Im doing .. init is called more than once. and the hooking is done more than once. Is there a way to check if we are already hooked ??? I will clean up my code to hook in a differente function but .. is there a way to check that ??

javirs Over a year ago

or.. is there a way to delete the old hooks ??

Alberto Fecchi Over a year ago

with $('#NAME').off('click'); you can remove the old handler

kp singh · Accepted Answer · 2014-02-25 08:13:48Z

1

Is your code registering the click handler more than one time on the same element. If so try to check the code. This is the situation which i have also faced. for first time click called once, for second time twice and so on every click register an a click handler on the same handler.

Also if you can show us the code for review.

answered Feb 25, 2014 at 8:13

kp singh

1,4609 silver badges22 bronze badges

Comments

Just code · Accepted Answer · 2014-02-25 08:12:07Z

0

function drawMarket(){
    $("#market").html("<ul id='marketList'>");
    $.each(sections, function(idx, obj){
        var name = htmlDecode(obj.Name);
        var listItem = $('<li  />');
        listItem.append(name);
        var innerComponent = $("<ul class='section' id='S_"+obj.Id+"'/>");

            var ItemName = htmlDecode(ItemObj.Name);
            innerComponent.append("<li id='"+ItemObj.Id+"' class='item'>"+ItemName+"</li>");

        listItem.append(innerComponent);
        listItem.append("<div class='clearer'/>");
        $("#marketList").append(listItem);
    });
    init();
}

Please replace this function inside your groceries.js it will help you

You don't need to each loop inside this function because it will always append inner text

answered Feb 25, 2014 at 8:12

Just code

13.8k10 gold badges54 silver badges94 bronze badges

4 Comments

javirs Over a year ago

Sorry, I dont get it... I have sections and every section has items. The outer each loops for every section. and for every section I want to add every item it contains. There is no way to avoid the inner loop.

Just code Over a year ago

can you try this once and see results

javirs Over a year ago

ItemObj will be unknown .. isnt it ?

javirs Over a year ago

yes I did and, as expected, ItemObj is NULL, never filled with nothing, ItemObj.Name is unknown, Uncaught ReferenceError: ItemObj is not defined

AppLend · Accepted Answer · 2014-02-25 08:24:26Z

0

You call function drawMarket() in the newSectionButtonClicked() each time when you click on the plus button, and call init() function in the drawMarket(), so you define click event many times

You can do something like this for make only one initial definithion:

jQuery(document).ready(function() {
    $("#addNewSection").click( function(e){
        newSectionButtonClicked();
    });
});

or

jQuery(document).ready(function() {
    init();
});

edited Feb 25, 2014 at 8:24

answered Feb 25, 2014 at 8:19

AppLend

1,6941 gold badge15 silver badges12 bronze badges

Collectives™ on Stack Overflow

Jquery click code being called multiple times

4 Answers 4

5 Comments

Comments

4 Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

5 Comments

Comments

4 Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related