Rails＆Ajax /异步加载部分

我有以下工作很好，加载部分点击链接。我遇到了麻烦，无论如何修改这个，以便在文档准备好或类似的部分加载。我基本上想要异步加载我的慢加载部分。任何人都可以指出我正确的方向吗？我觉得这可能是一个小改动来实现这一点。Rails＆Ajax /异步加载部分

#ProductsController 
def show_territories 
    respond_to do | format | 
    format.js {render :layout => false} 
    end 
end 

#products/show.html.erb 
<%= link_to 'Show Territories', show_territories_product_path(:id => @product.id), :remote => true %> 
<div id="spinner" class="spinner"><%= image_tag("ajax-loader-2.gif") %></div> 
<div id="territories" class="tab-contents"></div> 

#products/show_territories.js.erb 
$("#territories").html("<%= escape_javascript(render(:partial => "territories")) %>"); 

#products/_territories.html.erb 
<!--- partial view code goes here ---> 


#custom.js 
$(function(){ 
// hide it first 
$("#spinner").hide(); 

// when an ajax request starts, show spinner 
$(document).ajaxStart(function(){ 
    $("#spinner").show(); 
}); 

// when an ajax request complets, hide spinner  
$(document).ajaxStop(function(){ 
    $("#spinner").hide(); 
}); 
});

来源

2013-05-07 Raoot

如果你有一些东西在很多页面加载，我建议你去看看在这个非常有趣的帖子： http://paulirish.com/2009/markup-based-unobtrusive-comprehensive-dom-ready-execution/和扩展名：http://viget.com/inspire/extending-paul-irishs-comprehensive-dom-ready-执行 – MrYoshiji 2013-05-07 15:25:42

那么你可以通过调用click（）来手动触发部分加载。

<%= link_to 'Show Territories', show_territories_product_path(:id => @product.id), :remote => true, :id => 'territories_link' %> 

$(function(){ 
    // hide it first 
    $("#spinner").hide(); 

    $('#territories_link').click(); 

    ... 
});

来源

2013-05-07 15:21:37 Raindal

这真棒，完美的作品，我可以通过Chrome的RailsPanel看到我得到两个进程加载异步。我的微调停止了工作，但我会弄清楚。谢谢！！ – Raoot 2013-05-07 15:28:29

好！很高兴我可以帮助：）仅供参考，它为什么加载异步的原因是JavaScript“点击”链接，但不等待响应发生，只是继续执行其余的代码。 – Raindal 2013-05-07 15:35:21

是的，很酷，很确定这正是我需要的。只有我担心的是，如果我的更快的加载元素由于某种原因而停止运行，也许在完成之前加载它可能会阻碍它们的加载。但是，如果他们是异步的，也许不会。 – Raoot 2013-05-07 15:38:51

我一直想一些东西了基于rails's jquery-ujs（handleRemote方法）的代码。看来，这工作得很好，没有必要把一个实际的链接在页面：

$(function() { 
     var tmpElement = $(document.createElement('a')) 
     tmpElement.data('remote',true) 
     tmpElement.prop('href', '<%= j show_territories_product_path(id: @product.id) -%>') 
     $.rails.handleRemote(tmpElement) 
    })

来源

2013-10-09 08:07:22 Crystark

大把戏！很棒的作品，只需要小心Turbolinks！ – 2016-02-18 20:00:09

Rails＆Ajax /异步加载部分

回答

相关问题