Загрузка gif на link_to с рельсами ajax 3.2

Question

У меня есть link_to, что делает медленным из-за разбора большого количества данных JSON в шоу. У меня возникают проблемы с загрузкой gif на индексной странице, пока конечная страница заканчивает загрузку. Он показывает значок загрузки, но не переходит на страницу показа и не заканчивает анимацию.

CSS

#loading-indicator { 
    position: absolute; 
    left: 10px; 
    top: 10px; 
} 

Индексный

<img src="/images/loading.gif" id="loading-indicator" style="display:none" /> 
<% @list.each do |l| %> 
<%= link_to l.name, list_path(l), :remote => true %> 
<% end %> 

сценарий

<script> 
$(document).ajaxSend(function(event, request, settings) { 
    $('#loading-indicator').show(); 
}); 

$(document).ajaxComplete(function(event, request, settings) { 
    $('#loading-indicator').hide(); 
}); 
</script> 

Answer 1

в вашем Gemfile

gem 'blockuijs-rails', :git => 'https://github.com/BoTreeConsultingTeam/blockuijs-rails.git' 

в вашем js

applyLoader: function() { 
    $.blockUI({message: '<img src="/ring-alt.svg" width="75px" />', 
     css: { 
     border: 'none', 
     padding: '15px', 
     backgroundColor: 'transparent', 
     '-webkit-border-radius': '10px', 
     '-moz-border-radius': '10px', 
     opacity: .5, 
     color: '#fff' 
    }}); 
    }, 
    ajaxLoader: function() { 
    $(document).ajaxStart(function() { 
     applyLoader(); 
    }).ajaxStop(function() { 
     $.unblockUI(); 
    }); 
    },