views:

34

answers:

0

I use jquery 1.3.2 and jquery-ui tabs version 1.7.2. All of my tabs are loaded via Ajax. Within each tab, I want to display an Ajax loader whenever any Ajax call is active. The Ajax loader is inside the <div> that's being updated by the Ajax call.

I've tried the following:

$(function() {
        $("#ajaxLoader").ajaxStart(function() {
            $(this).show();
        }).ajaxStop(function() {
            $(this).hide();
        });
});

This works for the first tab, but on any other tab the #ajaxLoader spins all the time. When I move #ajaxLoader outside of the <div> being updated, it works.

Should the above script be inside the <div> being updated, or should it be on the main page?

Any other ideas?