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)
bezumkinВасилий Наумкин
14.03.2014 07:20

Нужно бы еще подключить сюда прямые ссылки через Hystory Api и получится отличное решение.

ВолодянВолодя
14.03.2014 12:55

Да я попробовал , все получилось, но есть одна проблема! код тут - https://gist.github.com/vgrish/9547112 Попробуй перейди на какую нибудь страницу пагинации. Затем обновить страничку и перейти на страницу пагинации №1. Ajaxsnippet получит ее из кеша...или хз в чем дело , но получаем уже не первую страницу... Смотреть тут - http://s5322.tefile.modx.pro/ayaks-snippet-history-api.html

ВолодянВолодя
14.03.2014 13:07

Беда , сайт удалили)))

ВолодянВолодя
14.03.2014 16:01

повторил тут - http://s5339.tefile.modx.pro/ Надеюсь на подсказку , в чем же дело?

Чикин Артур
14.03.2014 16:09

Первый вызов не срабатывает

ВолодянВолодя
14.03.2014 16:11

он срабатывает, но отдает контент первого вызова при обновлении страницы. Скорее всего дело в кешировании и плагине

Чикин Артур
14.03.2014 16:11

Или в 2 вызове и var.key

ВолодянВолодя
14.03.2014 16:15

не не не...

Чикин Артур
14.03.2014 16:27

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


[[!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`
]] 
ВолодянВолодя
14.03.2014 16:33

смотри мы обновляем страницу с параметрами в адр.строке

http://s5339.tefile.modx.pro/?page2=6

но запрос вот какой идет http://joxi.ru/Ci8jUxjKTJDVKaaE9Ho и потом сколько не пытайся получить пагинацию 1 - он выдаст ту страницу что была при обновлении. cache_key тут не поможет

ВолодянВолодя
14.03.2014 16:52

короче как я понял если бы pdoPage не редиректил с ?page=1 на просто страницу, то все бы работало)))

Чикин Артур
14.03.2014 16:58

Писать Василию хотелку что бы добавил параметр для отключения редиректа.

ВолодянВолодя
14.03.2014 16:59

Да я боюсь))) я помню как я Василия подначивал что этого редиректа нет)))

Чикин Артур
14.03.2014 17:03

Ну или тогда использовать # в урл. Как на одном из проектов в SimpleDream.ru сделали. Смотреть тут: http://gsgarden.ru/

Пощелкай по ссылкам и по обновляй страницу с #/news/ к примеру.

bezumkinВасилий Наумкин
15.03.2014 02:04

Ха-ха!

Посмотри исходники mSearch2 - там отлично работает ajax пагинация с прямыми адресами, редирект не мешает.

Смысл в том, чтобы при клике по ссылке выделить из неё номер страницы и отправить на сервер. Если номера нет - то это страница 1.

ВолодянВолодя
15.03.2014 05:09

У меня с таким же смыслом, если номера нет - страница 1.


if (!parseInt(pagenum)) {
        pagenum=1;
        Hash.remove(pagination); 
        url = url+"?"+pagination+"="+pagenum; 
    } 

Но пока в pdoPage не внес изменения - грузилась кешированая страница с первого запроса.

ВолодянВолодя
15.03.2014 05:42

мне так кажется что дело в этом -

$key = sha1(serialize($scriptProperties));
ВолодянВолодя
15.03.2014 05:57

фигню написал

ВолодянВолодя
14.03.2014 19:54

Да, как я и предполагал... Сменил предел с 1 на 0 и все заработало.

if (isset($_REQUEST[$pageVarKey]) && (!is_numeric($_REQUEST[$pageVarKey]) || $_REQUEST[$pageVarKey] <= 0)) {
    return $pdoPage->redirectToFirst();

Возможно есть более изящное решение...

Yana V
14.03.2014 07:53

Классно =) как всегда спасибо)!

ВолодянВолодя
17.03.2014 09:47

книжку скачал по JavaScript. Начал читать, пока только вступление осилил и переменные))). Сильно не ругайте за код... Попробовал реализовать бесконечную прокрутку аналогичным образом с помощью Ajaxsnippet. код тут - https://github.com/vgrish/ajaxscroll Работает как то так - http://s5354.tefile.modx.pro/

Чикин Артур
17.03.2014 11:35

Круто, может твои наработки включат в комплект к AjaxSnippet из коробки.

997142Марк Валерич
17.03.2014 11:48

а можно ли сделать то же самое, но еще докрутить автооткрытие page2, page3 при пролистывание товара вниз? что-то на подобии vk, когда листаешь страницу вниз?

ВолодянВолодя
17.03.2014 12:00
Mihail
19.03.2014 12:41

Это как раз то, что я долго искал. Но к сожалению, я не смог настроить должным образом. Все скрипты подключаю, сниппеты создаю и компоненты устанавливаю, но оно не хочет работать. Вот пример страницы http://mensales.ru/test/ . Помогите разобраться, пожалуйста.

997142Марк Валерич
17.03.2014 12:06

если честно, то проверил в мозиле и ян.бр и необходимо все таки нажимать на кнопку, а я хотел узнать, можно ли без нажима....

Может у меня траблы, но просмотрев gif, вроде бы увидел, что там есть автооткрытие..... но сам не увидел((((

ВолодянВолодя
17.03.2014 12:12

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

997142Марк Валерич
17.03.2014 12:22

Вот сейчас работает))) Спасибо)))

ЕвгенийК
09.04.2022 03:35
Это хорошо, что такая возможность есть и может быть использована. А то тенденция, мания, что-то в по...
begoodco1
07.04.2022 05:49
Зарегистрировался чтобы выразить благодарность за доступное и подробное описание процесса. Была возм...
bezumkin
Василий Наумкин
18.03.2022 12:35
Авторизация есть из коробки, для входа в базовую админку. Можно установить через composer и собрать ...
bezumkin
Василий Наумкин
10.03.2022 12:08
Ну, я имел в виду, что по закону можно =) А в реальности с валютой очевидные проблемы.
Сергей Лелеко
04.03.2022 06:12
О как! не знал! спасибо
bezumkin
Василий Наумкин
01.03.2022 15:32
Я делал одного бота на botman/botman, но из-за своей универсальности конкретно с Телеграм на нём раб...
bezumkin
Василий Наумкин
25.02.2022 09:22
P.S. Кажется цитаты у тебя никак не стилизуются в комментариях... Спасибо, поправил!
Electrica
Михаил
08.02.2022 11:19
Работает!
Алексей
09.01.2019 10:55
Насыщенный год ) От души поздравляю с ДР! Счастья, успехов и семейного благополучия! Жаль лимит заме...
septa rose
28.05.2018 22:16
hmmm, keren abis