Question

我想用load more按钮加载数据。我在posts / index.html.erb中实现了这样的实现：

  <div id="posts">
   <h1>Posts</h1>
    <%= render @posts %>
  </div>
  <div class="load-more-container">
   <%= link_to "Load More", posts_index_path, class: "load-more" %>
  </div>

然后_post.html.erb：

  <div class="post">
     <h2><%= post.title %></h2>
     <p><%= post.body %></p>
  </div>

然后是index.js.erb：

  $('#posts').append('<%= escape_javascript render(@posts) %>');

在posts_controller中，我这样写：

@@count=2
def index
  if params[:id]
    @posts = Post.where('id < ?', params[:id])
  else
    @posts = Post.limit(@@count)
  end
  @@count+=2
  respond_to do |format|
   format.html
   format.js
  end
end

然后在application.js：

$(document).ready(function () {
  $('a.load-more').click(function (e) {
    e.preventDefault();
    $.ajax({
        type: "GET",
        url: $(this).attr('href'),
        dataType: "script",
        success: function () {
            $('.load-more').show();
        }
    });
  });
});

我得到前2个数据：

Post1
Post2
load more

点击加载时我会得到这样的结果：

Post1
Post2
Post1
Post2
Post3
Post4

但我只想：

Post1
Post2
Post3
Post4

有谁可以帮助我。提前谢谢。

Answer 1

由于您每次都会获取所有记录，请点击 loadmore 按钮，不要附加结果并使用html覆盖

$（＆＃39;＃posts＆＃39;）。html（＆＃39;＆lt;％= escape_javascript render（@posts）％＆gt;＆＃39;）;

Answer 2

在您的控制器中，您替换 @posts = Post.limit(@@count) =＆gt; @posts = Post.limit(2).offset(@@count - 2) 如果你想加载更多2个技巧。

Ajax在Rails中调用加载更多按钮

2 个答案: