Wednesday, January 1, 2014

Global Ajax Event Handlers

These methods register handlers to be called when certain events, such as initialization or completion, take place for any Ajax request on the page. The global events are fired on each Ajax request if the global property in jQuery.ajaxSetup() is true, which it is by default.

Note: Global events are never fired for cross-domain script or JSONP requests, regardless of the value of global.


.ajaxComplete()
Register a handler to be called when Ajax requests complete. This is an AjaxEvent.
.ajaxError()
Register a handler to be called when Ajax requests complete with an error. This is an Ajax Event.
.ajaxSend()
Attach a function to be executed before an Ajax request is sent. This is an Ajax Event.
.ajaxStart()
Register a handler to be called when the first Ajax request begins. This is an Ajax Event.
.ajaxStop()
Register a handler to be called when all Ajax requests have completed. This is an Ajax Event.
.ajaxSuccess()
Attach a function to be executed whenever an Ajax request completes successfully. This is an Ajax Event.



example:

<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.js"></script>
  <script type="text/javascript" >
      $(document).ready(function () {
          $(document).ajaxSend(function () {
              alert(1);
              $(".log").text("Triggered ajaxSend handler.hhbfhgrthgrt");

          });
          $(".trigger").click(function () {
              alert(2);
              $(".result").load("ajax/test.html");

          });
          $(document).ajaxStart(function () {
              alert(3);
              $(".log").text("Triggered ajaxStart handler.");

          });

          $(document).ajaxSend(function (event, jqxhr, settings) {
              alert(4);            
              if (settings.url == "ajax1/test.html") {
                 
                  $(".log").text("Triggered ajaxSend handler.");

              }

          });
           $(document).ajaxStop(function () {
              alert(5);
              $(".log").text("Triggered ajaxStop handler.");

          });
          $(document).ajaxSuccess(function () {
              alert(6);
              $(".log").text("Triggered ajaxSuccess handler.");

          });
          $(document).ajaxComplete(function () {
              alert(7);
              $(".log").text("Triggered ajaxComplete handler.");

          });





      });
</script>


 <div class="trigger">Trigger</div>

<div class="result"></div>

<br />

<br />
<br /><br />
<br />
<br />
<div class="log"></div>

No comments:

Post a Comment