AjaxSnippet и аякс пагинация

Вызываем AjaxSnippet на странице

[[!AjaxSnippet?
    &snippet=`pdoPage`
    &element=`msProducts`
    &tpl=`tpl.msProducts.row`
    &limit=`3`
    &parents=`4`
    &page=`[[!geturi]]` 
    &wrapper=`tpl.ajax`
]]
Сниппет geturi

$filter = $_GET['page'];
return $filter;
Обертка для вывода tpl.ajax

<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', '.'+d["key"]+' .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>
Можно использовать несколько вызовов Ajaxsnippet, все будут работать независимо.
Пример реализации (будет жить до вечера) можно посмотреть тут
Надеюсь кому то пригодится)

28 комментариев

Василий Наумкин
Нужно бы еще подключить сюда прямые ссылки через Hystory Api и получится отличное решение.
Володя
Да я попробовал , все получилось, но есть одна проблема! код тут - https://gist.github.com/vgrish/9547112 Попробуй перейди на какую нибудь страницу пагинации. Затем обновить страничку и перейти на страницу пагинации №1. Ajaxsnippet получит ее из кеша...или хз в чем дело , но получаем уже не первую страницу... Смотреть тут - http://s5322.tefile.modx.pro/ayaks-snippet-history-api.html
Володя
Беда , сайт удалили)))
Володя
повторил тут - http://s5339.tefile.modx.pro/ Надеюсь на подсказку , в чем же дело?
Чикин Артур
Первый вызов не срабатывает
Володя
он срабатывает, но отдает контент первого вызова при обновлении страницы. Скорее всего дело в кешировании и плагине
Чикин Артур
Или в 2 вызове и var.key
Володя
не не не...
Чикин Артур
Тогда да, возможно кэш страницы берется с параметрами пагинации которая не соответствует действительности. Тогда для каждого вызова нужно сделать так:

[[!AjaxSnippet?
&snippet=`pdoPage`
&element=`msProducts`
&tpl=`tpl.msProducts.row`
&limit=`3`
&parents=`4`
&page=`[[!geturi]]` 
&wrapper=`tpl.ajax`
&cache_key=`blablabla1111`
]] 
и

[[!AjaxSnippet?
&snippet=`pdoPage`
&element=`msProducts`
&tpl=`tpl.msProducts.row`
&limit=`3`
&parents=`4`
&page=`[[!geturi]]` 
&wrapper=`tpl.ajax`
&cache_key=`blablabla232323`
]] 
Володя
смотри мы обновляем страницу с параметрами в адр.строке
http://s5339.tefile.modx.pro/?page2=6
но запрос вот какой идет http://joxi.ru/Ci8jUxjKTJDVKaaE9Ho и потом сколько не пытайся получить пагинацию 1 - он выдаст ту страницу что была при обновлении. cache_key тут не поможет
Володя
короче как я понял если бы pdoPage не редиректил с ?page=1 на просто страницу, то все бы работало)))
Чикин Артур
Писать Василию хотелку что бы добавил параметр для отключения редиректа.
Володя
Да я боюсь))) я помню как я Василия подначивал что этого редиректа нет)))
Чикин Артур
Ну или тогда использовать # в урл. Как на одном из проектов в SimpleDream.ru сделали. Смотреть тут: http://gsgarden.ru/
Пощелкай по ссылкам и по обновляй страницу с #/news/ к примеру.
Володя
Да, как я и предполагал... Сменил предел с 1 на 0 и все заработало.
if (isset($_REQUEST[$pageVarKey]) && (!is_numeric($_REQUEST[$pageVarKey]) || $_REQUEST[$pageVarKey] <= 0)) {
    return $pdoPage->redirectToFirst();
Возможно есть более изящное решение...
Василий Наумкин
Ха-ха!
Посмотри исходники mSearch2 - там отлично работает ajax пагинация с прямыми адресами, редирект не мешает.
Смысл в том, чтобы при клике по ссылке выделить из неё номер страницы и отправить на сервер. Если номера нет - то это страница 1.
Володя
У меня с таким же смыслом, если номера нет - страница 1.

if (!parseInt(pagenum)) {
        pagenum=1;
        Hash.remove(pagination); 
        url = url+"?"+pagination+"="+pagenum; 
    } 
Но пока в pdoPage не внес изменения - грузилась кешированая страница с первого запроса.
Володя
мне так кажется что дело в этом -
$key = sha1(serialize($scriptProperties));
Володя
фигню написал
Yana V
Классно =) как всегда спасибо)!
Володя
книжку скачал по JavaScript. Начал читать, пока только вступление осилил и переменные))). Сильно не ругайте за код... Попробовал реализовать бесконечную прокрутку аналогичным образом с помощью Ajaxsnippet. код тут - https://github.com/vgrish/ajaxscroll Работает как то так - http://s5354.tefile.modx.pro/
Чикин Артур
Круто, может твои наработки включат в комплект к AjaxSnippet из коробки.
Марк Валерич
а можно ли сделать то же самое, но еще докрутить автооткрытие page2, page3 при пролистывание товара вниз? что-то на подобии vk, когда листаешь страницу вниз?
Володя
Mihail
Это как раз то, что я долго искал. Но к сожалению, я не смог настроить должным образом. Все скрипты подключаю, сниппеты создаю и компоненты устанавливаю, но оно не хочет работать. Вот пример страницы http://mensales.ru/test/ . Помогите разобраться, пожалуйста.
Марк Валерич
если честно, то проверил в мозиле и ян.бр и необходимо все таки нажимать на кнопку, а я хотел узнать, можно ли без нажима....
Может у меня траблы, но просмотрев gif, вроде бы увидел, что там есть автооткрытие..... но сам не увидел((((
Володя
Ну если честно то может и у меня траблы, а может у вас экран огромный, и поэтому прокрутка не срабатывает... сейчас товаров больше закину - должно тогда включится...
Марк Валерич
Вот сейчас работает))) Спасибо)))
bezumkin.ru
Личный сайт Василия Наумкина
Прямой эфир
Дмитрий
08.02.2025 09:09:01
Спасибо за ответ. Есть желание разобраться самому. Прочитал все ваши статьи и понял, что VESP перспе...
Василий Наумкин
04.02.2025 19:27:08
Я таким давно не занимаюсь и с MODX не работаю. Попробуйте обратиться к ребятам с modx.pro.
Василий Наумкин
23.12.2024 05:33:00
В MODX сначала создали проблему, автоматически генерируя адреса, а потом "решили" заморозкой. Так ч...
Дмитрий
14.12.2024 09:10:38
Василий, прошу прощения, тупанул, не разобрался сразу. Фреймворк отличный! "Чистый лист" на vue, рис...
Василий Наумкин
05.12.2024 20:01:14
В итоге основная ошибка была в неправильном общем root в Nginx, из-за чего запросы не улетали на фай...
inna
06.11.2024 15:47:13
Да. Все работает. Спасибо.
Василий Наумкин
01.07.2024 11:56:41
Да, верно, именно так. А в контроллере, скорее всего, ловить данные методом post.
Василий Наумкин
26.06.2024 09:38:15
О, точно, вылезает если не залогинен. Спасибо, исправил!
Василий Наумкин
20.03.2024 21:21:52
Volledig!
Андрей
14.03.2024 13:47:10
Василий! Как всегда очень круто! Моё почтение!
Уровни подписки
Спасибо!
500 ₽ в месяц
Эта подписка ничего не даёт, просто возможность сказать спасибо за мои заметки. Подписчики отмечаются зелёненьким цветом в комментариях.
Большое спасибо!
1 000 ₽ в месяц
И эта подписка не даёт ничего, кроме оранжевого цвета в комментариях и возможности сказать спасибо, но уже большое!