javascript - 加载更多重复相同的值

Question

单击 loadmore div 时，我正在尝试加载更多评论。当我单击 Loadmore 时，此代码呈现的值与我最初呈现的值相同。例如，如果我最初呈现 10 条评论，当我单击加载更多时，它呈现相同的 10 条评论。

在 index.html.erb 中

<div class="main-content"><%= render :partial => 'comment' %></div>
<div class="loadmore" onclick="send()">Loadmore</div>

在 _comment.html.erb

 <% @comments.each do |comment| %>
 <%= comment.comments %>
 <%= end %>

在我的控制器中

@comments = Comment.paginate(:per_page => 10, :page => params[:page]).all(:order => 'updated_at DESC')
respond_to do |format|
      format.html # index.html.erb
      format.json { render json: @comments }
end

在 JavaScript 中

function send(){

     $.ajax({
        url: '<%= escape_javascript comments_path(:page =>(@comments.current_page)+1) %>',
        type: 'GET',
        dataType: 'json',           
        success: function(){                     
                 $(".main-content").append("<%= escape_javascript render :partial => 'comment' %>");
            }       
    });
}

如果代码错误，请建议我正确的代码。

Answer 1

我想说你可以在你的视图中尝试这个：

<div class="main-content"><%= render :partial => 'comment' %></div>
<div class="loadmore" onclick="send()" id="loadmore_button" data-page="2">Loadmore</div>

之后在 javascript 中，您需要获取当前页面，并将旧值更新为新的页面数据

function send(){
 var pager = $("#loadmore_button").data("page")
 $.ajax({
    url: '<%= escape_javascript comments_path %>?page='+pager,
    type: 'GET',
    dataType: 'json',           
    success: function(){                     
      $(".main-content").append("<%= escape_javascript render :partial => 'comment' %>");
      $("#loadmore_button").data("page", parseInt(pager)+1)
    }       
  });
} 

Answer 2

您params[:page]每次点击按钮时都不会更新，您需要在每次通过之前通过params[:page]添加值来重置您的offset