Подгрузка контента

Sergey

15.05.2017

Содержание:

Комментарии

Приветствую!
Подскажите, как реализовать такой же как у Вас на сайте «механизм» подгрузки контента при нажатии на кнопку (Загрузить ещё)?

В MODX это очень просто осуществить с помощью сниппета pdoPage из пакета pdoTools. С его помощью можно представить результат (если количество строк в нём больше минимального) в виде страничной пагинации или с подгрузкой посредством AJAX.
Вот пример, как можно организовать подгрузку контента (всех тикетов) с помощи кнопки «Загрузить ещё»:

<div id="pdopage">
  [[!+page.nav]]
  <div class="rows">
    [[!pdoPage?
      &element=`getTickets`
      &action=`tickets`
      &tpl=`tpl.Tickets.list.row`
      &parents=`0`
      &limit=`5`
      &maxLimit=`5`
      &ajaxMode=`button`
      &nestedChunkPrefix=`tickets_`
      &ajaxTplMore=`@INLINE <button class="btn btn-default btn-more">Загрузить ещё</button>`
    ]]
  </div>
</div>

dimitri

01.10.2017, 16:35

что-то не получается… Вообще ни чего не выводится

	<section class="s-yslygi inverse yslygi ha-waypoint" id="s-yslygi" data-animate-down="ha-header-show" data-animate-up="ha-header-hide" style="background-image: url(assets/app/img/fon_yslyg.jpg);">
	 	<div class="wrapp">
	 		<div class="container">
	 			<div class="row">
	 				<div class="col-md-12">
	 					<h2>Проводимая терапия</h2>
	 				</div>
	 			</div> 
	 			<div class="row"> 
		 			<div class="col-md-12">
			 			<ul class="ajax-container">
                  [[!pdoPage?
                  &element=`getTickets`
                  &action=`tickets`
                  &nestedChunkPrefix=`tickets_`
	 	 &parents=`20`
	 	&depth=`0`
	 	 &tpl=`ysItem`
	  &includeTVs=`image, opisanie_v, cenays, scidca`
	 &processTVs=`image, opisanie_v, cenays, scidca`
	 							  &limit=`6`
	 							  &ajaxMode=`button`
                  &ajaxTplMore=`@INLINE <button class="btn btn-default btn-more">Загрузить ещё</button>`
	 							  ]]

			 			</ul>
					
					</div>
					 
	 			</div>
	 					<div class="row">
		 				<div class="col-md-12">
	 					<div class="welcome-boton">
									[[!+page.nav]]
								</div>
						</div>
						</div>		
	 				
	 			</div>
	 	</div>
	 </section>

Sergey

12.05.2017, 12:37

Благодарю за оперативный ответ и помощь. Создаю портфолио дизайн-работ и такая реализация очень поможет.
Спасибо, всех благ!
P.S.
Неплохой тутор получился бы в коллекцию уроков Вашего сайта.

Войдите, пожалуйста, в аккаунт, чтобы оставить комментарий.

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