Question

我有以下工作非常好，加载部分点击链接。我无法修改这个，以便文件准备或类似的部分负载。我基本上想要异步加载我的慢加载部分。有人能指出我正确的方向吗？我觉得这可能是一个很小的修改，以实现这一目标。

#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();
});
});

Answer 1

你可以通过调用它们上的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();

  ...
});

Answer 2

我一直在根据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)
    })

Rails＆amp; Ajax / Async加载部分

2 个答案: