在AJAX刷新时,will_paginate分页呈现两次

时间:2015-07-24 04:54:04

标签: jquery ruby-on-rails ajax will-paginate filterrific

我正在使用Rails 4.2.2编写应用程序。我在我的视图中使用filterrific gem进行搜索/排序。我已经在我的列表中写了部分:

<div>
  <%= page_entries_info @work_items, model: 'work items' %>
</div>
<%= will_paginate %>
<div id="filterrific_results">
  <div>
  </div>

  <table class="table table-bordered table-hover work_item_list_table">
    <tr>
      <th>Phone Number</th>
      <th>Customer Name</th>
      <th>Twitter</th>
      <th>Account number</th>
      <th>Notes</th>
      <th>Age</th>
    </tr>
    <% work_items.each do |work_item| %>
      <tr>
        <td><%= link_to work_item.phone, work_item_path(work_item)%></td>
        <td><%= work_item.customer_name %></td>
        <td><%= work_item.twitter %></td>
        <td><%= work_item.account %></td>
        <td><%= truncate(work_item.notes, length: 300, separator: ' ') %></td>
        <td><%= time_ago_in_words(work_item.created_at) %> old, submitted at:<br />
            <%= work_item.created_at.strftime("%I:%M%p on %A, %B %e %Y") %></td>
      </tr>
    <% end %>
  </table>
</div>
<%= will_paginate %>

每当我更改过滤器选项并刷新列表时,我的分页都会被双重渲染:

http://i.stack.imgur.com/IrlHW.jpg

我的index.js.erb和work_items_controller.rb如下所示,或多或少直接来自filterrific示例应用程序(其中他们也使用will_paginate gem进行分页而没有此类问题):

<% js = escape_javascript(
  "render(partial: 'work_items/list', locals: { work_items: @work_items })
) %>
$("#filterrific_results").html("<%= js %>");

  def index
    @filterrific = initialize_filterrific(
      WorkItem,
      params[:filterrific],
      select_options: {
        sorted_by: WorkItem.options_for_sorted_by,
        completion_status: WorkItem.options_for_completion_status,
        needs_contact: WorkItem.options_for_needs_contact
      },
      persistence_id: 'shared_key',
      ) or return

    @work_items = @filterrific.find.page(params[:page])

    respond_to do |format|
      format.html
      format.js
    end

  end

和我的index.html.erb如下:

<% provide(:title, "All work items") %>
<h1>All work items</h1>

<div class="row">
  <div class="well">
    <%= form_for_filterrific @filterrific, html: { class: "form-inline" } do |f| %>

      <div class="form-group">
        <%= f.label :search, class: "sr-only" %> 
        <%= f.text_field(:search_query, class: 'form-control filterrific-periodically-observed work-item-search-box', placeholder: "Search") %>
      </div>

      <div class="form-group">
        <%= f.label :sorted_by %> 
        <%= f.select(:sorted_by, @filterrific.select_options[:sorted_by], {}, class: 'form-control' ) %>
      </div>

      <div class="form-group">
        <%= f.label :status %> 
        <%= f.select(:completion_status, @filterrific.select_options[:completion_status],
        { include_blank: "All" }, class: 'form-control') %>
      </div>

      <div class="form-group">
        <%= f.label :needs_contact %>
        <%= f.select(:needs_contact, @filterrific.select_options[:needs_contact],
        { include_blank: "All" }, class: 'form-control') %>
      </div>

      <div class="form-group">
        <%= link_to('Reset filters', reset_filterrific_url, class: "btn btn-default") %>
      </div>

      <%= render_filterrific_spinner %>
    <% end %>
  </div>
</div>
<div class="row">
  <div class="well">
    <%= render partial: 'work_items/list', locals: { work_items: @work_items } %>
  </div>
</div>

无论我在视图中是否有两个will_paginates,都会发生这种情况。如果我把will_paginate放在partial之外,那么当AJAX刷新时它就不会被刷新。关于如何消除这种想法的任何想法?

1 个答案:

答案 0 :(得分:2)

我发现了问题!我的分页不在我的#filterrific-results div之内,因此index.js.erb没有正确刷新。