Проблема (купить в 1 клик, модальное окно). pdoPage, Ajax [РЕШЕНО]

Добрый день!
Есть сайт, на нем стандартный вывод товаров через pdoPage (ajax) кнопкой «показать еще». В карточке товара есть кнопка «Купить в один клик»:
<a class="fancyboxModal element__application-button" style="font-weight: 700;" href="#productapplication" data-theme="{$pagetitle | striptags  | replace :' "':' «' | replace :'"':'»'}" data-id="{$id}">Купить в 1 клик</a>
и немного js:
$('#pdopage').on('click','a[href="#productapplication"]',function(e){
  e.preventDefault();
  var productapplicationtheme, productapplicationid;
  productapplicationtheme = $(this).data('theme');
  productapplicationid = $(this).data('id')
  $('#productapplicationinput').val(productapplicationtheme);
});
Но, работает модальное окно только на первой странице, если нажать кнопку «показать еще», товары показываются, но кнопка «Купить в один клик» уже не работает. Я думаю это связано с DOM деревом, но не пойму как решить.
Может кто-то уже сталкивался с подобным? Подскажите. Спасибо!
Алексей
Алексей
06 октября 2021, 09:47
modx.pro
989

Комментарии: 6

Павел Романов
Павел Романов
06 октября 2021, 11:26
Попробуйте переинициализировать fancybox по callback от pdoPage:
<script>
if(typeof pdoPage !== 'undefined') {
    pdoPage.callbacks.after = function(config, response) {
        $('.fancyboxModal ').fancybox({
	    // .....
        });
    };
}
</script>
    Алексей
    Алексей
    06 октября 2021, 12:07
    Павел, добрый день!
    Спасибо за ответ, но я не совсем понял что надо сделать? :(
      Павел Романов
      Павел Романов
      06 октября 2021, 12:36
      Добавить этот код на страницу, прописав вместо //… опции fancybox, которые у Вас используются для при клике на ссылку с классом fancyboxModal.
        Алексей
        Алексей
        06 октября 2021, 12:48
        Спасибо, я понял. Все поставил. Работает, но страница как-будто постоянно загружается
        Вот изначально:

        А вот когда нажимаешь «показать еще»:

        Но модальное окно работает
          Павел Романов
          Павел Романов
          06 октября 2021, 12:53
          А если так?:
          <script>
if(typeof pdoPage !== 'undefined') {
    pdoPage.callbacks.after = function(config, response) {
        $('.fancyboxModal ').fancybox({
	    // .....
        });
        
        $('#pdopage').removeClass('loading');
        $('#pdopage').css('opacity', 1);
    };
}
            Алексей
            Алексей
            06 октября 2021, 12:56
            А так все супер! Павел, спасибо огромное!!!
    Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
    6