AJAX Activity indicators with Rails 0.14.3
November 14th, 2005Step 1:
Create an element on the page that should be displayed while AJAX Requests are active. I mostly use an IMG element displaying an animated GIF file. Give this element an id="busy" attribute.
Step 2:
Create a file application.js in your public/javascripts folder (if you don’t already have one!), and be sure to use <%= javascript_include_tag :defaults %> in the HEAD section of your layout or view template to include the Rails-provided JavaScripts.
Insert the following code into the application.js file:
Ajax.Responders.register({
onCreate: function() {
if($('busy') && Ajax.activeRequestCount>0)
Effect.Appear('busy',{duration:0.5,queue:'end'});
},
onComplete: function() {
if($('busy') && Ajax.activeRequestCount==0)
Effect.Fade('busy',{duration:0.5,queue:'end'});
}
});
Step 3:
Enjoy!
Tweet
