Posted By

halk on 10/15/12


Tagged

ajax status monitor


Versions (?)

Who likes this?

3 people have marked this snippet as a favorite

spee66
BrockSamsom
thefrosty


Document Ready with Global Ajax Listener and Status Indicator


 / Published in: jQuery
 

This will monitor the status of all ajax calls on the page. When ajax starts i show an animated spinner gif and display a message that ajax has been requested. On completion of a call the status returned is displayed and the spinner is hidden to indicate the process is complete. This is without an extra line of code in any of the functions that call ajax, and applies globaly to all functions that make ajax calls on the page.

  1. $(function(){
  2. /**
  3.   * ATTACH AJAX LISTENER TO BODY TO MAKE A GLOBAL
  4.   * AJAX STATUS MONITOR FOR THE WHOLE PAGE. ANY AJAX
  5.   * CALL FROM ANY FUNCTION THAT RUNS ON THE PAGE
  6.   * WILL AUTOMATICALLY REPORT ITS STATUS
  7.   */
  8. $("body").ajaxStart(function(){
  9. $('#ajax_status_div').html("Ajax Request Sent");//update text message
  10. $('.activity_indicator').show(); //show ajax activity image(spinner gif)
  11. });
  12. $("body").ajaxSuccess(function(event,xmlHttp,options){
  13. var status = xmlHttp.statusText;
  14. var url = options.url;
  15. var data = options.data;
  16. $('.activity_indicator').hide(); //hide ajax activity image(spinner gif)
  17. $('#ajax_status_div').html("URL : "+url+" <br/> Status : "+status);//update text message
  18. });
  19. });

Report this snippet  

You need to login to post a comment.