JS 控制 ajax 选项卡和 JS 控制 will_paginate 在同一个 js.erb 中不起作用（无限滚动）答案

【问题标题】：JS controlling ajax tabs and JS controlling will_paginate in same js.erb not working (endless scroll)JS 控制 ajax 选项卡和 JS 控制 will_paginate 在同一个 js.erb 中不起作用（无限滚动）
【发布时间】：2014-01-17 07:30:43
【问题描述】：

我已尝试解决此问题一段时间，但找不到解决方案。我有 ajax 控制页面选项卡上的一些，这工作正常：

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

但后来我添加了将无限滚动的 will_paginate，我将控制它的 js 放在与上述相同的 js.erb 文件中（sale.js.erb）：

$("#feed-content").html("<%= escape_javascript(render(:partial => "#{@partial_name}")) %>");
$('#products').append('<%= escape_javascript(render(:partial => 'sale_content', :products => @products, :remote => true)) %>');
<% if @products.next_page %>
$('.pagination').replaceWith('<%= escape_javascript( will_paginate(@products)) %>');
<% else %>
$('.pagination').remove();
<% end %>

但这不起作用。但是每个部分都是单独工作的。

然后我尝试了这个，但它仍然不起作用（它只加载 if 部分）：

<% if params[:feed]%>
$("#feed-content").html("<%= escape_javascript(render(:partial => "#{@partial_name}")) %>");
<% else %>
$('#products').append('<%= escape_javascript(render(:partial => 'sale_content', :products => @products, :remote => true)) %>');
<% if @products.next_page %>
$('.pagination').replaceWith('<%= escape_javascript( will_paginate(@products)) %>');
<% else %>
$('.pagination').remove();
<% end %>

视图

...
<p class="hero-description-dark local-nav-container">Sort by <%= link_to "popular", products_popular_path(:feed => "popular"), :remote => true, :class => "active"%> or <%= link_to "sale", products_sale_path(:feed => "sale"), :remote => true%></p>

控制器

def sale
 products = Product.gender(current_user).available.includes(:likes)
 @products = products.filter_by_categories(products).first(100).paginate(:page =>  params[:page], :per_page => 6)
 @partial_name = "sale"
 respond_to do |format|
  format.html
  format.json { render json: @products}
  format.js
end
  end

【问题讨论】：

这个params[:feed]里面是什么？它是返回布尔值 true/false 还是整数 1/0 ？
我已经用我的视图文件和控制器文件更新了这个问题。我使用 params[:feed] 传递一个值，然后检查该值是否存在。但显然我做错了什么。就是不知道怎么解决。

标签： javascript ruby-on-rails ajax tabs will-paginate

【解决方案1】：

缺少<% end %> 标记。我这不是问题。试试这样的：

<% if params[:feed].present? %>
   $("#feed-content").html("<%= escape_javascript(render(:partial => "#{@partial_name}")) %>");
<% else %>
   $('#products').append('<%= escape_javascript(render(:partial => 'sale_content', :products => @products, :remote => true)) %>');
   <% if @products.next_page %>
     $('.pagination').replaceWith('<%= escape_javascript( will_paginate(@products)) %>');
   <% else %>
     $('.pagination').remove();
   <% end %>
<% end %>

【讨论】：

嗯，这会产生与“if params[:feed]”相同的结果。我希望javascript的第一部分仅在我单击视图中的“link_to remote true”部分时运行，而第二部分在滚动发生时运行。现在它一直运行 if 部分。

【解决方案2】：

我自己找到了解决方案。我在我的“远程真实”链接中添加了 ID，就像这样。在这种情况下“流行”：

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

然后在相应的popular.js.erb 文件中，我向控制选项卡的ajax 添加了一个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 %>

可能有更好更清洁的方法，但这对我有用。我问了另一个问题here，这与这个问题几乎相同。只是如果有人需要更多详细信息。

更新：

上述解决方案需要在链接上单击两次才能呈现部分内容。应该使用下面的代码：

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

【讨论】：