Comments on: Global AJAX Cursor Change

By: Jeff

Jeff — Sat, 24 Sep 2011 22:07:24 +0000

Very elegant solution. Thank you!

By: Quora

Quora — Mon, 03 Jan 2011 15:03:15 +0000

Is there any middleware for AJAX calls?…

The following is an example using jQuery, so if you are using it, it is fairly simple to change the cursor style during the call. If you are not using jQuery, you can still follow the idea by implementing event triggers similar to jQuery’s ajaxStart()…

By: eric

eric — Fri, 17 Sep 2010 04:21:59 +0000

thank you this is totally simple and I had my busy / wait cursor in mere moments!

Eric

By: Site-Specific Browsers and You | JulioSepia.com

Site-Specific Browsers and You | JulioSepia.com — Tue, 17 Aug 2010 22:17:38 +0000

[…] indicators. You could implement a “busy” cursor yourself using Jason T. Johnson’s Global AJAX Cursor Change technique on every […]

By: Madison

Madison — Fri, 11 Sep 2009 17:22:53 +0000

Hi,

Please change the color of the orange text in the orange headers towards greater contrast. I totally missed ‘view plain’ and ended up cutting and pasting line numbers.

By: Jason Johnson

Jason Johnson — Fri, 07 Aug 2009 12:26:53 +0000

@Lee - Good point. Thanks for the suggestion. I have updated the post accordingly.

By: Lee Parker

Lee Parker — Mon, 03 Aug 2009 18:33:06 +0000

This is a great snippet of code. It worked well for our site except when there were multiple ajax requests fired off around the same time. The problem came in that when the first request finished, it would remove the ‘busy’ class even though another request was still in progress. jQuery provides two other events “ajaxStart” and “ajaxStop”. “ajaxStart” only happens when an ajax request begins and no other requests are currently in progress. “ajaxStop” only happens when the last concurrent request is finished. This worked out much better for our purposes.

By: Jason Johnson

Jason Johnson — Wed, 29 Apr 2009 19:50:34 +0000

Paul: It's been a while since I used Prototype, but I think it would look something like this: ~~~~~~~~ // Global AJAX responders Ajax.Responders.register({ onCreate: function() { if (Ajax.activeRequestCount > 0) { $$('html')[0].addClassName('busy'); } }, onComplete: function() { if (Ajax.activeRequestCount == 0) { $$('html')[0].removeClassName('busy'); } } }); ~~~~~~~~

By: Paul Robinson

Paul Robinson — Wed, 29 Apr 2009 12:13:35 +0000

I am not using jOuery but would like to apply this with my limited knowledge of Javascript. We have a Ruby on Rails application using Ajax which is quite slow as there is quite a bit of database queries and page building happening.

Would I use the same snippets for prototype?

By: Jason Johnson

Jason Johnson — Tue, 13 Jan 2009 17:43:55 +0000

Thanks, JP. I’ve updated the snippet accordingly. That was a good article.