错误Ajax选项卡使用无尽的滚动时使用Rails' will_paginate(Error

TL; DR

我的AJAX标签不与我无尽的实施滚动（will_paginate）的合作。

细节

我有了在我的控制器加载不同的动作来呈现不同的内容部分Ajax选项卡页面。 因此，“流行视点”有+两个远程：上方真正的联系。 它们工作得很好。 他们提供相应的部分适当地使用的respond_to JS。

问题是，我也在这些分页与分音will_paginate（无尽的滚动像Ryan Bates的截屏）。

这意味着，我不想在js.erb运行的代码，因为AJAX控制我的标签是摆在那里。 这意味着，它只是更换档案（.html）我的内容，而不是追加新内容的方式无限滚动的脚本试图做（和确实对我的其他网页）。

但是，即使我知道它使我我不知道如何解决这个问题的问题：

问题：popular.js.erb

$("#feed-content").html("<%= escape_javascript(render(:partial => 'feed_content')) %>");


$('#products').append('<%= escape_javascript(render(:partial => 'feed_content', :products      => @products, :remote => true)) %>');
<% if @products.next_page %>
$('.pagination').replaceWith('<%= escape_javascript( will_paginate(@products)) %>');
<% else %>
$('.pagination').remove();
<% end %>

Products_controller

def popular
   @products = Product.paginate(:page => params[:page], :per_page => 6)
 respond_to do |format|
  format.html 
  format.js 
 end
end

def sale
   @products = Product.paginate(:page => params[:page], :per_page => 6)
 respond_to do |format|
  format.html 
  format.js 
 end
end

查看/ popular.html.erb

<header>
<p>Sort by <%= link_to "popular", products_popular_path, :remote => true, :class => "active"%> or <%= link_to "sale", products_sale_path, :remote => true%></p> 
</header>
<div class="bucket layout-single-column" id="feed-content">
<%= render "feed_content", :products => @products%>
</div>
<%= will_paginate @products %>

部分：_feed_content.html.erb

 <div id="products">
<% @products.each do |product|%>
  #CODE 
<% end %>

products.js.coffee

jQuery ->
  if $('.pagination').length
      $(window).scroll ->
              url = $('.pagination .next_page').attr('href')
              if url &&  $(window).scrollTop() > $(document).height() - $(window).height() - 50
                      $('.pagination').text('Fetching more products...')
                      $.getScript(url)
$(window).scroll()

Answer 1:

我找到了解决办法我自己。 我添加的ID像这样我的“远程真正的” -links。 在这种情况下，“流行”：

<p>Sort by <%= link_to "popular", products_popular_path(:feed => "popular"), :remote => true, :class => "active", :id => "popular"%>

然后在相应的popular.js.erb文件I加入onClick事件到控制选项卡中的AJAX。 这意味着，当链接被点击，在不网页时应该做无休止的滚动部分阿贾克斯只运行。

$("#popular").click(function() {
$("#feed-content").html("<%= escape_javascript(render(:partial => "#{@partial_name}")) %>");
});

$('#products').append('<%= escape_javascript(render(:partial => "#{@partial_name}")) %>');
<% if @products.next_page %>
$('.pagination').replaceWith('<%= escape_javascript( will_paginate(@products)) %>');
<% else %>
$('.pagination').remove();
<% end %> 

有可能是一个更好的和更清洁的方式，但是这为我工作。 我问另外一个问题在这里几乎是相同的，因为这一个。 只是如果有人需要更多的细节。

更新：

上述解决方案所需的链路上的两次点击来呈现的部分。 该代码的下方，而应使用：

$('#popular').bind('ajax:complete', function() {
  $("#feed-content").html("<%= escape_javascript(render(:partial => "popular_content")) %>");
});

文章来源: Error in Ajax tabs when using endless scroll with Rails' will_paginate