Не работают два вызова pdoPage на одной странице.

Здравствуйте.

Кто сталкивался с такой проблемой, отзовитесь )
На сайте MODX Revo. 2.5.7 необходимо вывести getImageList два раза через ajax, при помощи прокрутки на соответствующем блоке.


Первый вывод:
<div id="pdopageLam" class="materialsContainer">

        <div class="materials materials-first clearfix">
           
            [[!pdoPage?
                &element=`getImageList`
                
                &tvname=`jalousie-material-verticalTV` 
                &docid=`73` 
                &tpl=`jalousie-box-materialTpl`
                &sort=`[{"sortby":"price","sortdir":"ASC"}]`
                &where=`{"published":"1"}`
                &limit=`10`
                &maxLimit=`1000000`
                
                &cache=`1`
                &cacheTime=`86400`
                
                &pageVarKey=`pdopageLam`
                &pageNavVar=`lam.navLam`
                &totalVar=`ImagesTotal_Lam`
                &toPlaceholder=`ImagesResult_Lam`
                
                &ajaxElemWrapper=`#pdopageLam`
                &ajaxElemRows=`#pdopageLam .materials`
                &ajaxElemPagination=`#pdopageLam .pagination`
                &ajaxElemLink=`#pdopageLam .pagination a`
              
                &ajaxMode=`scroll`
            ]]

            [[!+ImagesTotal_Lam:ne=`0`:then=`[[+ImagesResult_Lam]]`:else=`<p>Материалы отсутствуют</p>`]]

        </div>
        
        [[!+lam.navLam]]
    
</div>


Второй вывод: 
<div id="pdopageBasis" class="materialsContainer">

        <div class="materials materials-second clearfix">
            
            [[!pdoPage?
                &element=`getImageList`
                
                &tvname=`jalousie-material-verticalTV` 
                &docid=`73` 
                &tpl=`jalousie-box-materialTpl`
                &sort=`[{"sortby":"price","sortdir":"ASC"}]`
                &where=`{"published":"1"}`
                &limit=`10` 
                &maxLimit=`1000000`
                
                &cache=`1`
                &cacheTime=`86400`
                
                &pageVarKey=`pdopageBasis`
                &pageNavVar=`basis.navBasis`
                &totalVar=`ImagesTotal_Basis`
                &toPlaceholder=`ImagesResult_Basis`
                
                &ajaxElemWrapper=`#pdopageBasis`
                &ajaxElemRows=`#pdopageBasis .materials`
                &ajaxElemPagination=`#pdopageBasis .pagination`
                &ajaxElemLink=`#pdopageBasis .pagination a`
                
                &ajaxMode=`scroll`
            ]]

            [[!+ImagesTotal_Basis:ne=`0`:then=`[[+ImagesResult_Basis]]`:else=`<p>Материалы отсутствуют</p>`]]

        </div>
        
        [[!+basis.navBasis]]
    
</div>


И тут проблема. Работает только верхний вывод, при попытке скролла нижнего, подгрузка идёт в верхний блок. По одиночке они работают правильно, в паре нет.

До этого был вывод при помощи: &ajaxMode=`button` подгрузка была правильной, и в паре и по одиночке.

В чём может быть проблема?
Максим
Максим
26 декабря 2017, 20:41
modx.pro
1 439
0

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

Дмитрий
Дмитрий
27 декабря 2017, 20:14
1
0
Копать надо в сторону js
    Володя
    Володя
    27 декабря 2017, 20:46
    0
    попробуйте обновить pdoTools до последней версии. Теоретически не должно быть проблем. Не так давно где то делал подобное только на феном.
      Максим
      Максим
      08 января 2018, 15:58
      0
      Нет, обновление до последней версии не решило проблему.
      Максим
      Максим
      08 января 2018, 16:57
      0
      Изначально не предусмотрено два и более scroll — подгрузки на странице. Проблему решил с помощью «JS — костыля».
      Немного видоизменил файл: assets/components/pdotools/js/pdopage.js

      Сначала, к родительским блокам: 

      <div id="pdopageLam" class="materialsContainer"> и 
<div id="pdopageBasis" class="materialsContainer">

      добавляем атрибуты: reached=«1» и reached=«2»

      В pdoPage добавляем параметр &frontend_js=`[[+assetsUrl]]js/pdopage.js` так как по умолчанию ссылается на pdopage.min.js и вот pdopage.js нужно немного отредактировать.

      Мне нужно было сделать максимум до трёх выводов с ajax загрузкой при скролле на блоке, поэтому скрипт корректно работает только до трёх выводов на одной странице.

      В самом файле: pdopage.js объявляем три глобальные переменные (после pdoPage.Reached = false): 

      pdoPage.Reached_1 = false;
pdoPage.Reached_2 = false;
pdoPage.Reached_3 = false;

      Меняем событие скролла: 

      $window.on('scroll', function () {

     if (!pdoPage.Reached && $window.scrollTop() > wrapper.height() - $window.height()) {
          pdoPage.Reached = true;
          pdoPage.addPage(config);
     }
});

      на: 

      var idCont = wrapper.selector;
$(idCont).on('scroll', function(){

     if($(this).attr('reached') == 1) {

          if(!pdoPage.Reached_1) {
               pdoPage.Reached_1 = true;
               pdoPage.addPage(config);
          }
     }
     if($(this).attr('reached') == 2) {

          if(!pdoPage.Reached_2) {
               pdoPage.Reached_2 = true;
               pdoPage.addPage(config);
          }
     }
     if($(this).attr('reached') == 3) {

          if(!pdoPage.Reached_3) {
               pdoPage.Reached_3 = true;
               pdoPage.addPage(config);
          }
     }
});

      В запросе $.post(...) добавляем (после pdoPage.Reached = false): 

      pdoPage.Reached_1 = false;
pdoPage.Reached_2 = false;
pdoPage.Reached_3 = false;

      Вот так оно работает. Загрузка происходит при скролле конкретного блока, а не всей страницы как было ранее.
      Сделано грубо, зато быстро )
        Максим
        Максим
        08 января 2018, 17:10
        0
        Переменные pdoPage.Reached_1, 2, 3 нужны что бы загрузка происходила при достижении определённой позиции ползунка. Без них, запросы на сервер льются рекой и некоторые данные могут не подгружаться. Особенно если прокрутили резко.
          Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
          5