AjaxSnippet и пагинация

Здравствуйте, подскажите, как сделать пагинацию с помощью AjaxSnippet?
[[AjaxSnippet?
&snippet=`pdoPage`
&wrapper=`myWrapper`
&element=`msProducts` 
&limit=`12` 
]]
<div class="clr"></div>
[[!+page.nav]]
Николай Загумённов
Николай Загумённов
22 февраля 2014, 20:19
modx.pro
3 587
Поблагодарить автора Отправить деньги

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

Aртур Чикин
Aртур Чикин
23 февраля 2014, 23:13
pdoPage это обертка для любого сниппета выводящего информацию.
Получается pdoPage и AjaxSnippet тоже обертка, а выводить им нечего.

Вот документация читайте и вникайте:
http://docs.modx.pro/components/ajaxsnippet
    Yana V
    Yana V
    13 марта 2014, 15:14
    А как то побороть такое можно?) или писать свое решение?
      Володя
      Володя
      13 марта 2014, 18:00
      Ну обертка да. Помоему тут Василий как раз и говорит о том что можно сделать аякс пагинацию… 
      $(document).on('as_complete', document, function(e,d) {
	console.log(d);
});
      данные же у нас все приходят…
        Aртур Чикин
        Aртур Чикин
        13 марта 2014, 18:10
        А я разве сказал что ее нельзя сделать?) Я по мой му только сказал что им нечего выводить:) И для пагинации надо писать совй js
          Володя
          Володя
          13 марта 2014, 21:47
          Хотя знаешь задумался, и чет никак не соображу как тут подступиться с аякс пагинацией,
          Ну вывести пагинацию это все понятно, перехватить клик по пагинации — тоже понятно.
          А вот как организовать запрос к сниппету на этой же странице с выводом содержимого в этот же блок?
          Я продумал до отправки post запроса и понял что я не знаю как мне подгрузить страницу и чтоб еще сработало событие as_complete и взять ответ в json…
          Если шариш — хотя бы теоретически подскажи порядок действий,
          Спасибо!
            Володя
            Володя
            13 марта 2014, 23:55
            сделал с грехом пополам… но почему то возвращаемый контент двоится…
              Николай
              Николай
              14 марта 2014, 00:26
              Не забывай делиться своими наработками. Кому то в дальнейшем это может помочь.
                Володя
                Володя
                14 марта 2014, 08:47
                Делюсь)
                код на странице
                <div class="pagin"></div>

[[!AjaxSnippet?
&snippet=`pdoPage`
&element=`msProducts`
&tpl=`tpl.msProducts.row`
&limit=`3`
&depth=`1`
&parents=`4`
&showLog=`0`
&page=`[[!geturi]]` 
&as_mode=`onload`   
]] 

<script>
    $(document).on('as_complete', document, function(e,d) {
    $(".pagin").append(d["pagination"]);
	//console.log(d["pagination"]);

	$(document).on('click', '.pagination a', function(e) {
	e.preventDefault();
    var url = $(this).attr('href');
    //console.log(url);

    $.post(url, {as_action: d["key"]}, function(response) {
	    if (typeof response.output !== "undefined") {
		    $('.ajax-snippet').html(response.output);
		
		    $(".pagin").html(response.pagination); 

	      }
    }, "json");                  
                    
 
    }); 
});
    
</script>


<div class="pagin"></div>
                [[!geturi]]
                <?php
$filter = $_GET['page'];
return $filter;
                смотреть что получилось тут — s5322.test.modx.pro/test.html
                Aртур Чикин
                Aртур Чикин
                14 марта 2014, 07:02
                Ты отчищаешь div от контента который там уже есть?
                  Володя
                  Володя
                  14 марта 2014, 08:44
                  Да это я уже тут начудил ночью… щас все проверил, нормально работает
                    Aртур Чикин
                    Aртур Чикин
                    14 марта 2014, 08:47
                    НУ теперь выкладывай решение:)
                      Володя
                      Володя
                      14 марта 2014, 09:21
                      пошел дальше и немного переписал код, теперь можно несколько независимых пагинаций на странице вызывать
                      <h2>первый вызов</h2> 
 
[[!AjaxSnippet?
&snippet=`pdoPage`
&element=`msProducts`
&tpl=`tpl.msProducts.row`
&limit=`3`
&depth=`1`
&parents=`4`
&showLog=`0`
&page=`[[!geturi]]` 
&as_mode=`onload`   
&wrapper=`
<div class="pagin [[+key]]"></div>

<div id="[[+key]]" class="ajax-snippet">
			<img src=" " class="as_spinner" style="width:32px;margin:auto;display:block;">
</div>

<div class="pagin [[+key]]"></div>
`
]] 

<h2>второй вызов</h2>
[[!AjaxSnippet?
&snippet=`pdoPage`
&element=`msProducts`
&tpl=`tpl.msProducts.row`
&limit=`3`
&depth=`1`
&parents=`4`
&showLog=`0`
&sortdir=`DESC`
&page=`[[!geturi]]` 
&pageVarKey=`page2`
&as_mode=`onload`   
&wrapper=`
<div class="pagin [[+key]]"></div>

<div id="[[+key]]" class="ajax-snippet">
			<img src=" " class="as_spinner" style="width:32px;margin:auto;display:block;">
</div>

<div class="pagin [[+key]]"></div>
`
]] 

<script>
    
    $(document).on('as_complete', document, function(e,d) {
 
    $(".pagin."+d["key"]).append(d["pagination"]);
 
	$(document).on('click', '.pagination a', function(e) {
	e.preventDefault();
    var url = $(this).attr('href');
    //console.log(url);

    $.post(url, {as_action: d["key"]}, function(response) {
	    if (typeof response.output !== "undefined") {
		    $('.ajax-snippet#'+d["key"]).html(response.output);
		
		    $(".pagin."+d["key"]).html(response.pagination); 

	      }
    }, "json");                  
                    
 
    }); 
});
    
</script>
                      смотреть тут — s5322.test.modx.pro/ayaks-snippet-neskolko-vyizovov.html
      yani
      yani
      09 апреля 2014, 19:09
      А у меня возник вопрос, у меня есть параметр where, например color=red
      и в пагинации он не сохраняется =(
      то есть ?page=2 а надо ?page=2&color=red
      если вызывать не как AjaxSnippet, а как обычный pdoResources, то пагинация окей.
      придется копаться в классах? (
        yani
        yani
        09 апреля 2014, 19:42
        UPDATE
        Покопалась в сниппете AjaxSnippet. ссылка там строится без указания параметров.
        На свой страх и риск поменяла код где то на 20 строке 
        $script = '
$.post("'.$modx->context->makeUrl($modx->resource->id, '', 'full').'", {as_action: "'.$key.'"}, function(response) {
	if (typeof response.output !== "undefined") {
		$("'.$as_target.'").html(response.output);
		spinner.remove();
		$(document).trigger("as_complete", response);
	}
}, "json");';
        на 
        $script = '
$.post("'.$_SERVER['REQUEST_URI'].'", {as_action: "'.$key.'"}, function(response) {
	if (typeof response.output !== "undefined") {
		$("'.$as_target.'").html(response.output);
		spinner.remove();
		$(document).trigger("as_complete", response);
	}
}, "json");';
        Может кто подскажет как правильнее это реализовать?)
        PS при таком обращении можно не использовать (по крайне мере у меня работает) сниппет geturi. Но у меня переход по страничкам не ajax
          Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
          18