Pages

Tuesday, January 8, 2013

jQuery - AJAX Events

Local Events:

These are callbacks that you can subscribe to within the Ajax
request object.
$.ajax({
   beforeSend: function(){
     // event handling
   },
   complete: function(){
     // event handling
   }
   // ......
 });

Global Events :

These events are broadcast to all elements in the DOM, triggering any
handlers which may be listening. You can listen for these events like so:
$("#loading").bind("ajaxSend", function(){
   $(this).show();
 }).bind("ajaxComplete", function(){
   $(this).hide();
 });
Global events can be disabled, for a particular Ajax request, by
passing in the global option, like so:
 $.ajax({
   url: "MyPage.html",
   global: false,
   // ...
 });

Events:

Below is the full list of Ajax events, where the ajaxStart and ajaxStop events are
 events that relate to all Ajax requests together.
  • ajaxStart (Global Event)
    This event is broadcast if an Ajax request is started and no other
    Ajax requests are currently running.
    • beforeSend (Local Event)
      This event, which is triggered before an Ajax request
      is started, allows you to modify the XMLHttpRequest object
      (setting additional headers, if need be.)
    • ajaxSend (Global Event)
      This global event is also triggered before the request is run.
    • success (Local Event)
      This event is only called if the request was successful (no errors
       from the server, no errors with the data).
    • ajaxSuccess (Global Event)
      This event is also only called if the request was successful.
    • error (Local Event)
      This event is only called if an error occurred with the request
       (you can never have both an error and a success callback with a request).
    • ajaxError (Global Event)
      This global event behaves the same as the local error event.
    • complete (Local Event)
      This event is called regardless of if the request was successful,
      or not. You will always receive a complete callback, even for
      synchronous requests.
    • ajaxComplete (Global Event)
      This event behaves the same as the complete event and will be
      triggered every time an Ajax request finishes.
  • ajaxStop (Global Event)
    This global event is triggered if there are no more Ajax requests being processed.