JS классы

На странице с постраничной навигацией, шаблон компонента постраничной навигации должен быть указан - bxmaker_ajaxpagenav_default

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

На странице после загрузки существует объект window.BXmakerAjaxpagenav , методы которого вы можете использовать для своих задач. Если чего то не хватает - напишите на почту указанную внизу страницы.

Подгрузка при прокрутке

Метод showMore() - начинает подгрузку следующей страницы, тоже самое вызывает клик по кнопке показать еще. Первым параметром надо указать название группы(контекста). Удобно использовать в случае, когда вам нужно сделать подгрузку контента по мере прокрутки страницы пользователем.

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

window.BXmakerAjaxpagenav.showMore('catalog_section');

//пример подойдет в принципе на любой сайт

    $(window).on("scroll", function() {
        var navBottom = $('.bxmaker__ajaxpagenav__block--navbottom');
        var hiddenAreaHeight = 500; // минимальная растояние до постраничной навигации, при достижении которой начнется подгрузка
        var w = $(this);

        if(navBottom.length)
        {
            var navBottomTop = navBottom.offset().top;
            //если растояние до области постраничной навигации нижней менее hiddenAreaHeight пикселей, то подгружаем еще контент
            if((w.scrollTop() + w.height()) >= (navBottomTop - hiddenAreaHeight)) {
               window.BXmakerAjaxpagenav.showMore(navBottom.attr('data-key'));
            }
        }
    });

Загрузка и отображение следующей или предыдущей страницы

Аналогично работают методы prevPage() и nextPage(), первым параметром также передается название группы (контекста). При вызове этого события, если страница уже загружалась и есть в памяти, то контент отобразится сразу, если нет, то произойдет подгрузка.

После этого страница автоматически будет прокручена к верхнему блоку постраничной навигации чтобы человек не прокручивал страницу вниз и сразу смог увидеть результат.

window.BXmakerAjaxpagenav.nextPage('catalog_section'); 

События после подгрузки контента модулем

Также классом генерируются события, которые можно отслеживать и стилизовать элементы допустим, выравнивать по высоте, проставлять флаги, менять названия кнопок с дефолтных на актуальный и так далее.

Событие успешной загрузки контента - bxmaker.ajaxpagenav.successResponse

$(document).on('bxmaker.ajaxpagenav.successResponse', function(e, data){ 
   // data.href -  запрошенный адрес
   // data.key -  название группы(контекста)
   // data.showmore - true/false - true если была нажата кнопка показать еще
   // data.result - ответ сервера на ajax запрос в json формате
    
});

Событие при наличии ошибок в ответе - bxmaker.ajaxpagenav.errorResponse - параметры такие же как у предыдущего

Событие ошибки при попытке сделать запрос и обработать ответ - bxmaker.ajaxpagenav.errorRequest - параметры такие же

Обновление контента фильтром, сортировкой по AJAX

Если у вас на странице уже есть блок с постраничной навигацией и вам нужно его изменить, загрузив по ajax, например изменилась сортировка и перезагружается весь блок контента включая и навигацию, то после размещения нового контенту, нужно заново проинициализировать методы для работы постарницчной навигации, для этого есть соответствующий метод

window.BXmakerAjaxpagenav.init();

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