Выбор количества результатов на странице через выпадающее меню
Я использую камень для пагинации каминари. Я могу ограничить результаты на странице до 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
,