Rails 3 / Kaminari / JQuery - 加载更多按钮：显示结果的问题（它加载整个页面布局而不仅仅是局部布局）

Question

首先将ajax和jquery与rails结合使用，我正在尝试在用户索引页的底部创建一个“加载更多”链接。 我的用户索引页面应该显示10个第一个用户，然后单击它加载用户div底部的下10个用户的链接等。 我使用Kaminari进行分页。

我从以下代码开始：

User_controller.rb

def index
  @users = User.page(params[:page]).per(10)
end

用户/ index.html.erb

<div id="users">
  <%= render :partial => @users %>
</div>
<%= link_to "Load more", "#", :class => "next" %>

_user.html.erb

<div id="box">
  <%= link_to full_name(user), user %>
</div>

的application.js

我发现这个片段（信誉：here）试图满足我的需求：

function loadMore(pageNo) {
  var url = '/users?page=';
  $.get(url + pageNo, function(response) {
    $("#users").append(response);
  });
}

$(document).ready(function() {
  var currPage = 1;
  $("a.next").click(function() {
    loadMore(++currPage);
  });
});

我工作得很完美，除了它加载所有页面布局，下一个结果不仅是我的_user部分中的box div 我该怎么办呢？我是否必须创建一个index.js.erb（类似于：page.insert_html：bottom，：users，：partial =＆gt; @users但是在jquery中，如果是这样，我该怎么办？）

感谢您的帮助

Answer 1

您不需要为它创建另一个操作。我会使用不引人注目的JavaScript。尝试这样的事情：

---

<强> User_controller.rb

你不需要在这里改变任何东西，只要确保控制器响应js

respond_to :html, :js

用户/ index.html.erb

<div id="users">
  <%= render :partial => @users %>
</div>
<%= link_to_next_page @users, 'Load More', :remote => true, :id=>"load_more_link" %>
<%###  link_to_next_page is a Kaminari function that returns exactly what the name implies %>

用户/ index.js.erb的

$('#users').append("<%= escape_javascript(render :partial => @users)%>");
$('#load_more_link').replaceWith("<%= escape_javascript(link_to_next_page(@users, 'Load More', :remote => true, :id=>'load_more_link'))%>");

---

这应该是让它运作所需的一切。当然，您可以添加一些javascript来在单击链接时插入加载图标或其他任何内容。 注意：我没有测试过这个确切的实现，所以可能会有一些错误，但你应该能够理解

Answer 2

您应该为此创建一个自己的操作，并与其自己的视图相关联。然后，请务必禁用布局的渲染：

def more_users
  @users = User.page(params[:page]).per(10)
  render :layout => false
end