Prevent multiple AJAX requests

Question

Problem: AJAX call gets called multiple times though it has been called once.

Functionality: I make a AJAX call(mootools Request.JSON) on click of a button. The initial call gets complete however there are multiple calls which get initiated. The number of times is random i.e sometimes 2 or 3.

This issue exists for other AJAX calls too. How do i prevent these extra calls?

I read somewhere about binding/unbinding of AJAX calls but dint quite convince me

Answer 1

Find out why and where your ajax call gets triggered, then find the reason why this trigger gets fired and prevent that trigger from firing multiple times. But without your code we cannot really help you on that.

edit

This might help: http://api.jquery.com/jQuery.ajaxPrefilter/

There is even an example that matches exactly your problem of firing a request multiple times at the same time.

Answer 2

I highly suspect this is due to event propagation/bubbling (due to nested elements.)

See my fiddle for example: http://jsfiddle.net/FHRv7/1/

All of the DIV's have been told to show an alert on click. By clicking on A or B, you will notice that three alerts appear. This is because the not only are you firing the event for the box containing the letter, but the two that appear beneath them.

C however has been setup to cancel propagation by using e.stopPropagation(); which tells jQuery/Javascript not to process any more events.

I hope this helps?

Gav