ruby-on-rails - ajax と rails を使用したコンテンツのロード

Question

重複の可能性:
特定のページに Ajax スピナーを表示するにはどうすればよいですか?

2 つのタブがあるこのナビゲーション メニューがあります。

<div id="user_menu">
 <ul class="nav nav-tabs">
  <li class="active"><%= link_to "Group1", group1_friends_path(@user), :remote => true %></li>
  <li><%= link_to "Group2", group2_friends_path(@user), :remote => true %></li>
 </ul>
</div>

Ajax に特定のパーシャルをレンダリングさせることができました。タブをクリックすると、パーシャルがターゲットのプレースホルダー div に読み込まれます。

tab.js: assest/javascripts/ に配置しました

$(function() {
    $('#user_menu a').click(function (e) {
        $('ul.nav-tabs li.active').removeClass('active')
        $(this).parent('li').addClass('active')
        $("#friends-data").fadeOut(function(){
            $("#loading-indicator").fadeIn();
        });
    });
});

すべてのコンテンツを同時に表示して、すべての http リクエストがレンダリングされるまでユーザーを待たせるのは好きではありません。読み込みバーを表示したいのですが、すべての http リクエストが終了したら、読み込みバーを非表示にしてコンテンツを表示します。

正しいことは、機能的というよりも演劇的です。任意のヘルプ、例をいただければ幸いです。