7

カミナリを使って、「さらにロード」する ajax ページネーションを作成したいと考えています。私はこのコードを使用しています:

class BienvenueController < ApplicationController
  def index
    @articles = Admin::Article.page(1).per(2)
    respond_to do |format|
      format.html
      format.js 
    end
  end
end

# Bienvenue#index

<div class="container"  style="min-width:<%= @width %>px">
<%= render "shared/articles" %>
<%= link_to_next_page @articles, 'Load More', :remote => true, :id=>"load_more_link" %>

# Shared/articles

<% @articles.each do |a| %>
        <article class="<%= a.rubrique.color %>">
                <div class="sharing">
                    <%= image_tag "facebook-32.png" %>
                </div>
                <p class="color<%= a.rubrique.color %>"><i>Le <%= I18n.localize(a.created_at, :format => :long) %>  par David Perrotin</i></p>
                <h1><%= a.titre %></h1>
                <div class="excerpt">
                    <%= a.chapo.html_safe %>
                </div>
                <div class="image">
                    <%= image_tag a.mainphoto.url(:medium), :width=>"100%" %>
                </div>
                <div class="contenu">
                    <%= a.contenu.html_safe %>
                </div>
                <div class="readmore">
                    <%= link_to "Continuer la lecture", article_path(a) %>
                </div>
            </article>
        <% end %>

# index.js.erb

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

しかし、問題は、「さらに読み込む」をクリックすると、常に 2 つの同じ記事が表示され、希望するように、部分的な記事がさらに 2 つの記事で更新されないことです。

4

1 に答える 1

3

他の人を助けるかもしれないこれに関する問題に遭遇しました。replaceWithjQuery のバージョンによっては、 on を使用しないで#load_more_linkくださいindex.js.erb

空の replaceWith が何もしないという回帰 ( http://bugs.jquery.com/ticket/13401link_to_next ) があるため、セットの最後のページでが空になり、行が作成されます:$('#load_more_link').replaceWith('');したがって、置換されません最後の「もっと見る」ボタンを押すと、データ セットの最後のページが継続的に読み込まれます。

jQuery のバージョンを更新するかempty().html('...')、replaceWith の代わりに使用することで修正されました。

于 2015-01-30T14:41:41.750 に答える