prevent ajax call from firing repeatedly

Question

$('.myDiv').click(function(event){ $.ajax({ url: '', dataType: 'json', success: function(json) { for (var i = 0; i < json.length; i++) { var response = json[i]; $('.result_new').append('<p>' + response.name + '</p>'); } //$('.content').append('<p>' + response.total + '</p>'); } });

})

event.stopPropagation()

isn't preventing the ajax call from being called repeatedly. Is there a function for this in Jquery?

I don't see anything calling this repeatedly. Are you saying the click event is being triggered repeatedly? — Ariel
– Ariel, Commented Sep 27, 2011 at 2:27

user800014 · Accepted Answer · 2011-09-27 02:27:25Z

$('.myDiv').click(function(){ if( !$(this).hasClass('loading') ) { //add control class $(this).addClass('loading'); //do ajax... $.ajax({ success: function() { $('.myDiv').removeClass('loading') } }) } });

CamelCamelCamel · Accepted Answer · 2011-09-27 02:26:52Z

event.stopPropagation() only prevents the event from bubbling up (from .myDiv to it's parent element until reaching the window). It doesn't prevent the function from executing.

You can use various methods to identify whether the request was sent or not, for example set .data(), e.g:

$(".myDiv").click(function() { if (typeof $(this).data('inTheMiddleOfAnAJAXCall') == "undefined") { $(this).data('inTheMiddleOfAnAJAXCall', true); // Create an AJAX Call } });

Collectives™ on Stack Overflow

prevent ajax call from firing repeatedly

2 Answers 2

Comments

Comments

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Related