CODEWITHSUNDEEP
javascriptjquery
dsi
dsi

Reputation: 3369

jquery click event executes multiple times in single click

I have a template file which gets dynamically included inside two or more DIV in single page: divs will be AS below : 1. VIEW div 2. EDIT div other can be - RESOLUTION div ...

EDIT div is display none while VIEW div appear and reversal. so, only one can be appear at a time.

template file contains below javascript:

   AJS.$(document).on('click', '#addROW', function()
   {
      console.log('calling');
      ....
      ..
   }

now, when i click on add button (existed in template file) then it executes above event and it should add a single row and print a log message but, it executes doubles so, initially executes two times (as template included in two screens) and prints two times message 'calling' and after some times, it gets double 4 times executes. I expect it should executes one time only and prints 'calling' message once only.

How can i resolve this issue.

It looks like due to javascript is added multiple times.. but how can i control to add it single times into the page or any other way to resolve this issue ?

Thank You

Upvotes: 1

Views: 2068

Answers (2)

JamesN
JamesN

Reputation: 387

You can check the script is setted or not for assign new event :

AJS.$(document).on('click', '#addROW', function (event) {
    if (event.handled !== true) {
        //put your code here
        event.handled = true;
    }
    return false;
}

Upvotes: 2

Chandu
Chandu

Reputation: 1042

Try this

AJS.$(document).on('click', '#addROW', function(event)
{
  event.stopPropagation();
  console.log('calling');
  ....
  ..
}

Upvotes: 1

Related Questions