使用ajax和rails加载内容

Question

  

可能重复：
  How to have Ajax spinner show on specific page?

我的导航菜单包含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渲染某些部分内容。现在，当我单击选项卡时，partials会加载到我的目标占位符div中。

我在assest / javascripts /

中放置的

tab.js：

$(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请求完成后，隐藏加载栏并显示内容。

正确的知识更具戏剧性，然后才具有功能性。任何帮助，例如将不胜感激。