Как реализовать Ajax с гемом will_paginate на Ruby on Rails - PullRequest
0 голосов
/ 30 января 2019

Я хочу реализовать Ajax в своем проекте ruby ​​on rails.В настоящее время я использую камень will_paginate.Всякий раз, когда я нажимаю на следующую страницу, вся страница перезагружается, чего я не хочу.Как я могу предотвратить это?Я нашел похожий вопрос , но он не работал для меня.Я думаю, это потому, что я использую Rails 5.2.2?Я не уверен.

Мой index.html.erb выглядит следующим образом:

 <div class="row justify-content-center align-items-center">
       <div class="page_info">
        <h5><%= page_entries_info @imports %></h5>
       </div>
 </div>
 <div class="row justify-content-center align-items-center">
       <div class="page_info">
        <h5><%= will_paginate @imports, :container => false %></h5>
       </div>
 </div>

Вот мой код в моем controller.rb:

class ImportsController < ApplicationController
  def index
     @imports = Import.all
     @imports = Import.paginate(:page => params[:page], :per_page => 5)   
  end

1 Ответ

0 голосов
/ 30 января 2019

Чтобы разбить на страницы с помощью AJAX вместо обновления страницы, вам нужно добавить data-remote="true" ко всем ссылкам на страницы.

data-remote="true" - это помощник рельсов, который заставит сервер интерпретироватьзапрос в виде JS вместо HTML.

Первый шаг, создайте новый помощник:

module RemoteLinkPaginationHelper
  class LinkRenderer < WillPaginate::ActionView::LinkRenderer
    def link(text, target, attributes = {})
      attributes['data-remote'] = true
      super
    end
  end
end

Во-вторых, добавьте метод paginate в application_helper.

module ApplicationHelper
  def paginate(collection, params= {})
    will_paginate collection, params.merge(:renderer => RemoteLinkPaginationHelper::LinkRenderer)
  end
end

Затем вы можете заменить это:

<div class="row justify-content-center align-items-center">
  <div class="page_info">
    <h5><%= will_paginate @imports, :container => false %></h5>
  </div>
</div>

на это:

<div class="row justify-content-center align-items-center">
  <div class="page_info">
    <h5><%= paginate @imports, :container => false %></h5>
  </div>
</div>

Я получил эти шаги из этого фрагмента GitHub: https://gist.github.com/jeroenr/3142686

...