Выбор количества результатов на странице через выпадающее меню

Я использую камень для пагинации каминари. Я могу ограничить результаты на странице до 6. Это пример моей нумерации страниц в моем products_controller:

def index
  @products = Product.order(:title).page(params[:page]).per(6)
end

Но вместо того, чтобы жестко кодировать "6" в коде нумерации страниц, я хочу, чтобы пользователь мог изменить это через представление пользовательского интерфейса. Мне нужно выпадающее меню в представлении, чтобы пользователь мог выбрать "3", "6" или "9". Как я могу это сделать? Я предполагаю, что это может включать переменную экземпляра для хранения выбора пользователя, но я не уверен, кто-нибудь может помочь? У меня есть это выпадающее меню в моем application.html.erb:

<div id="per-page">
  <select>
    <option value="3">3</option>
    <option value="6">6</option>
    <option value="9">9</option>
  </select>
</div>

1 ответ

Решение

Добавить name (например, "per") в поле выбора, например:

<select name="per"> ... </select>

Вы также можете посмотреть на использование select_tag, который поможет вам убедиться, что соответствующая опция выбрана на основе выбора пользователя.

и затем измените:

Product.order(:title).page(params[:page]).per(params.fetch(:per, '6').to_i)

который получит выбор пользователя (или "6", если ни один не выбран) и приведёт его к целому числу (я не уверен, что это принуждение необходимо для Каминари).

Да, вам, вероятно, понадобится кнопка "Перейти". Вы должны иметь возможность просто обернуть ваше поле выбора как:

 <form>
   <div id="per-page"> ... </div>
   <button>Go!<button>
 </form>

который должен работать, потому что действие по умолчанию формы - текущая страница.

Предполагая, что вы используете jQuery и что ваше поле выбора имеет идентификатор per Вы также можете опустить кнопку (хотя вам все еще нужно form), а в JavaScript сделайте:

$('#per').on('change', function() {
  $(this).closest('form').submit();
});

Некоторые предложения по отладке

Положил <%= debug params %> где-то ближе к нижней части application.html.erb (но внутри body).

Попробуйте вручную добавить per параметр вашего URL, например, localhost:3000/search?per=3,

Другие вопросы по тегам