У меня есть приложение Rails, которое использует Kaminari для нумерации страниц. Пагинация построена с использованием AJAX. Я хотел бы использовать историю браузера, чтобы использовать кнопки назад и вперед в браузере. У меня работает функциональность AJAX, но история браузера не работает.
Вот моя пагинационная ссылка:
<%= paginate @contacts, remote: true %>
Ссылки имеют этот HTML-код:
<ul class="pagination">
<li>
<a data-remote="true" href="/contacts?page=3">3</a>
</li>
</ul>
Вот мой код JS:
$(document).on('turbolinks:load', function() {
$('#term').autocomplete({
source: '/contacts/autocomplete',
minLength: 3,
select: function(event, ui) {
$('#term').val(ui.item.value);
$(this).closest('form').submit();
}
});
$('.pagination a[data-remote=true]').on('click', function() {
console.log(this);
window.history.pushState({}, '', $(this).attr('href'));
});
$(window).on('popstate', function() {
$.get(document.location.href);
});
});
Когда я нажимаю ссылку на пагинацию, в адресной строке браузера указывается href, что мне и нужно. Однако, когда я нажимаю другую ссылку на страницу, адресная строка не меняется. Кроме того, когда я нажимаю кнопку «Назад» в браузере, она не возвращается на предыдущую страницу.