jQuery AJAX trick (very useful!)

3 Jul

Did you ever ask yourself how can you display a “loading” indicator when you make ajax calls using various libraries?

The simple but efficient answer is this:

1
2
3
4
5
6
$(document).ready(function(){
$('<div id="busy">Loading...</div>')
        .ajaxStart(function() {$(this).show();})
        .ajaxStop(function() {$(this).hide();})
        .appendTo('body');
});

And that’s all. You need to do this only once.

Ofcourse, you can apply some CSS styles to #busy div, using an image generated with ajaxload or something similar.

I didn’t use any other libraries (actually i used prototype with scriptaculous sometime like AGES ago), but i think all cool libraries (like jQuery) have similar methods.

Another great news: with MORE than 50 fixes (but no new features tough) jQuery UI 1.5.1 is out.

Tags: , ,

Bookmark this article!

Del.icio.usDiggStumbleUponFurlRedditTechnorati

SlashDotWindows LiveYahooGoogleFacebookBlogLines

1 Comment »

Leave a comment