- コントローラが、どのリストのどのページ リンクを押したかを認識していることを確認する必要があります。パラメータを will_paginate ページ リンク ジェネレータに渡すことでこれを行います。
- いずれかのリストのページネーションを更新するときに、js が正しい html タグを更新していることを確認する必要があります。ムード依存の :) div タグでページネーションをラップすることでこれを行います。
- パーシャルを共有するので、ムードと正しいコレクションがコントローラーに設定され、インデックス ビュー (html と js の両方) からローカルとしてパーシャルに渡されることを確認する必要があります。
- 最後に、ページネーションを再描画した後、ajax リモートが応答することを確認してください (これはおまけです)。
したがって、リクエストの気分パラメーターに応じてコントローラーインスタンス変数を設定するには
- このコードはまた、いくつかの db 呼び出しを節約することに注意してください。なぜなら、悲しいユーザーをページインするだけなら、幸せなユーザーまたはすべてを取得する必要がないからです)。
- 簡単にするために @users を省略します。使用されることはありません
- 悲しいユーザーのための幸せなスコープは単なるタイプミスだと思います
.
# controller
def index
@mood = params[:mood]
@mood_users = @happy_users = User.happy_scope.paginate(:page => params[:page], :per_page => 5) if @mood.blank? || @mood == 'happy'
@mood_users = @sad_users = User.happy_scope.paginate(:page => params[:page], :per_page => 5) if @mood.blank? || @mood == 'sad'
respond_to do |format|
format.html # index.html.erb
format.xml { render :xml => @users }
format.json { render :json => @users }
format.js
end
end
適切なローカルをパーシャルにディスパッチするようにしてください:
# index.html.erb
<%= render :partial => 'users/user', :locals => {:users => @happy_users, :mood => 'happy' } %>
<%= render :partial => 'users/user', :locals => {:users => @sad_users, :mood => 'sad' } %>
個別の div タグ ID を許可する部分的なムード センシティブを作成します。リクエストURLにも気分を入れてください。
# users/user partial
<div id='<%= "#{mood || ''}users"%>'>
<% users.each do |user| %>
Show some fields
<% end %>
<%= will_paginate users, :params => { :mood => mood } %>
</div>
この js を使用すると、押されたページネーション リンクに応じて、さまざまな div 内のさまざまなコレクションを更新できます。
# index.js.erb
$("#<%= @mood %>users").html('
<%= escape_javascript(render(partial: "users/user", locals: { users: @mood_users, mood: @mood })) %>
');
ページネーションのための目立たない ajax リンクが必要です。
Ruby - Rails 3 - AJAXinate ページネーションとソート
# in a generic js
$(document).ready(function () {
$(".pagination").find("a").livequery(function () {
$(this).attr("data-remote", true);
});
});
JavaScript が有効になっておらず、html にフォールバックしている場合でも、このソリューションは機能するはずです。この場合、両方のセクションを再表示して、異なるページを許可する必要があります。
HTML への Graceful JS フォールバックも処理するようにコードを修正
コントローラ
# controller
def index
@mood = params[:mood]
@happy_page = @mood == 'happy' ? params[:page] : params[:happy_page]
@sad_page = @mood == 'sad' ? params[:page] : params[:sad_page]
@mood_users = @happy_users = User.happy_scope.paginate(:page => @happy_page, :per_page => 5) if !request.xhr? || @mood == 'happy'
@mood_users = @sad_users = User.happy_scope.paginate(:page => @sad_page, :per_page => 5) if !request.xhr? || @mood == 'sad'
@mood_users = @users = User.scoped.paginate(:page => params[:page], :per_page => 5) if @mood.blank?
respond_to do |format|
format.html # index.html.erb
format.xml { render :xml => @users }
format.json { render :json => @users }
format.js
end
end
新しいビュー変数を部分ローカルに転送します
# index.html.erb
<%= render :partial => 'users/user', :locals => {:users => @happy_users, :mood => 'happy', :happy_page => @happy_page, :sad_page => @sad_page } %>
<%= render :partial => 'users/user', :locals => {:users => @sad_users, :mood => 'sad', :happy_page => @happy_page, :sad_page => @sad_page } %>
ここでこれを渡すだけで、未定義のメソッドが部分的に取得されなくなります。
# index.js.erb (fixed HTML syntax)
$("#<%= @mood %>users").html('
<%= escape_javascript(render(partial: "users/user", locals: { users: @mood_users, mood: @mood, :happy_page => @happy_page, :sad_page => @sad_page })) %>
');
これにより、悲しいページのリンクがクリックされた場合に幸せなページがパラメーターに保持され、その逆も同様です。
# users/user partial
<div id='<%= "#{mood || ''}users"%>'>
<% users.each do |user| %>
Show some fields
<% end %>
<%= will_paginate users, :params => { :mood => mood, :happy_page => happy_page, :sad_page => sad_page %>
</div>