will_paginate 在 twitter bootstrap 选项卡中加载下一页的默认活动选项卡

Question

所以我是运行 rails 4 并且有一个使用 Twitter bootstrap tabs/nav 的页面，每个选项卡上也有 will_paginate。

我遇到的问题是，当我更改页码时，它会返回到默认的活动选项卡，而不是我正在分页的选项卡。

代码如下：

控制器

....
def admin
   @quotes = Quote.paginate(page: params[:quotes_page], :per_page => 20).order("created_at DESC")
   @users = User.paginate(page: params[:users_page], :per_page => 20).order("created_at DESC") 
   @blogs = Blog.paginate(page: params[:blogs_page], :per_page => 20).order("created_at DESC")
end
....

view.html.erb

<div class="tabbable tabs-left">
<div class="row">
  <div class="col-md-4">
    <ul class="nav nav-pills nav-stacked">
      <li class="active"><a href="#users-tab" data-toggle="tab">Users</a></li>
      <li class=""><a href="#quote-tab" data-toggle="tab">Quotes</a></li>
      <li class=""><a href="#blog-tab" data-toggle="tab">Blogs</a></li>
    </ul>
  </div>
  <div class="col-md-8">
    <div class="tab-content">

      <div class="tab-pane fade in active" id="users-tab">
        <div class="tabbable tabs-left">
          <ul class="nav nav-tabs">
            <li class=""><a href="#user-index" data-toggle="tab">List Users</a></li>
          </ul>
          <div class="tab-content">
            <div class="tab-pane in active" id="user-index">
              <%= render :template => 'users/index' %>
            </div>
          </div>
        </div>
      </div>
      <div class="tab-pane fade in" id="quote-tab">
        <div class="tabbable tabs-left">
          <ul class="nav nav-tabs">
            <li class="active"><a href="#quote-new" data-toggle="tab">New Quote</a></li>
            <li class=""><a href="#quote-index" data-toggle="tab">List Quote</a></li>
          </ul>
          <div class="tab-content">
            <div class="tab-pane in active" id="quote-new">
              <%= render "quotes/fields", :quote => Quote.new %>
            </div>
            <div class="tab-pane in" id="quote-index">
              <%= render :template => 'quotes/index' %>
            </div>
          </div>
        </div>
      </div>
     .... More code of the same
     </div>
  </div>
</div>

users/index.html.erb

<div>
  <%= will_paginate @users, :param_name => 'users_page'  %>
  <% @users.each do |u| %>
  .....
  <% end %>
</div>

quotes/index.html.erb

<div>
  <%= will_paginate @quotes, :param_name => 'quotes_page'  %>
  <% @quotes.each do |u| %>
  .....
  <% end %>
</div>

所以我想了解的是，如果我在引号选项卡中并单击分页 link 到第二页，它会保留在引号选项卡中而不重新加载页面进入用户的默认活动选项卡。

我注意到的其他事情，如果我点击所有不同的分页 links 它只会添加到参数中。

即。如果我去引用页面 2 和用户页面 4，url 看起来像这样：

http://something.com/view?quotes_page=2&users_page=4

我预计它只会保留一个参数，例如：

http://something.com/view?users_page=4

Answer 1

您可以添加

<%= will_paginate @quotes, :param_name => 'quotes_page', params: {active_tab: 'quotes'}  %>

和

<div class="tab-pane fade in #{'active' if params[:active_tab] == 'quotes'}" id="quote-tab">

与用户选项卡相同。有关详细信息，请参阅：https://github.com/mislav/will_paginate/wiki/API-documentation

will_paginate 在 twitter bootstrap 选项卡中加载下一页的默认活动选项卡

will_paginate with in twitter bootstrap tabs loads default active tab on next page

ruby-on-rails

will-paginate

twitter-bootstrap