CODEWITHSUNDEEP
jqueryajax
Jordan Sitkin
Jordan Sitkin

Reputation: 2343

Subscribe to the 'complete' event of a .load() on a specific DOM element?

I already use both .live() and .bind('ajaxComplete') to accomplish certain related tasks, but I have found myself wanting to be able to listen for the 'complete' event of a specific DOM element which will call jQuery's .load() at various times.

In this situation I don't want to listen for ALL complete events globally (unless someone can show me how to get the proper target from the event object returned by 'ajaxComplete'). I would like to be able to do something like this:

$('.selector').load('url.php',{data:data},function(){
   // LOCAL complete function
});

and then somewhere else, attach a handler to listen and execute some other code whenever that ajax call fires and completes:

$('.selector').bind('complete',function(){ ... });

I know that I can use what I indicated above as the "LOCAL complete function" to attach some functionality, but I would like to be able to bind to the complete event from elsewhere in my code - much like I do with other events such as 'click'.

Is there any way to do this? Or must i always make use of the 'complete' event within the context of the load() method?

Upvotes: 2

Views: 1520

Answers (2)

PetersenDidIt
PetersenDidIt

Reputation: 25620

Just trigger the complete event in your local complete callback:

$('.selector').load('url.php',{data:data},function(){
   $(this).trigger('complete');
   // Local handling of the complete event.
});

$('.selector').bind('complete',function(){ ... });

Upvotes: 2

Dustin Laine
Dustin Laine

Reputation: 38503

You were close on your example, see the .load() documentation at jQuery. http://api.jquery.com/load/

$('.selector').load('url.php',function() {
    //Complete function
});

Upvotes: 0

Related Questions