<div id="pdopage">
<div class="rows">
[[!pdoPage?
&parents=`[[*id]]`
&ajaxMode=`button`
&limit=`2`
&includeTVs=`img`
&tpl=`newsItem.tpl`
&ajaxTplMore=`@INLINE <button class="btn btn-black btn-more pull-right">More</button>`
]]
</div>
[[!+page.nav]]
</div>newsItem.tpl содержит:
<img src="[[+tv.img]]" alt="[[+title]]">Доп поле img у которого Media Source создан другой и внем
BasePath и BaseUrl = assets/images/На первой странице картинки вовыдятся как нужно, но после нажатия на кнопку More картинки не выводятся т.к. в пути к изоражению отсутсвует часть «assets/images/» т.е. не добавляется BaseUrl из Media Source.
Куда копать? )
Павел Романов 22.03.2017 13:53 #
Константин 22.03.2017 14:00 #
но там же по документации вроде бы «1» стоит по умолчанию — подготавливать все поля…
Дмитрий 22.03.2017 17:18 #
Владислав 11.06.2017 03:45 #
При ajax-загрузке контента с помощью pdopage перестают работать скрипты слайдеров и галерей, потому что они работают только с контентом, который был загружен во время загрузки страницы. Перепробовал уже
$('body').on( 'click', '.btn-more', function() { });
и
pdoPage.callbacks['after'] = function(config, response) { };
и
$(document).ajaxSuccess(function() { };
ничто не отрабатывает правильно. При вызове обычного alert, изначально появляется модальное окно, а уже потом подгружается контент, из чего делаю вывод, что при клике по кнопке с классом .btn-more изначально загружаются скрипты, а уже потом подгружается контент с помощью ajax, с которым подгруженные скрипты уже не работают. Помогите понять как решить проблему
Владислав 12.06.2017 05:40 #
Получилось заставить работать галерею с помощью ajaxStop. Правда тут возникла другая сложность — после подгрузки контента ajax'ом функция, которая была отработана во время изначальной загрузки страницы продолжает работать и после загрузки контента ajax'ом, при этом дублируя результаты отработки после каждого нажатия на кнопку btn-more. Пока не могу понять как обнулить результаты отработки функции и одновременно снова загрузить скрипт.
$(function(){
var $gallery = $('.rows a').simpleLightbox();
$gallery.on('show.simplelightbox', function(){
console.log('Requested for showing');
})
.on('shown.simplelightbox', function(){
console.log('Shown');
})
.on('close.simplelightbox', function(){
console.log('Requested for closing');
})
.on('closed.simplelightbox', function(){
console.log('Closed');
})
.on('change.simplelightbox', function(){
console.log('Requested for change');
})
.on('next.simplelightbox', function(){
console.log('Requested for next');
})
.on('prev.simplelightbox', function(){
console.log('Requested for prev');
})
.on('nextImageLoaded.simplelightbox', function(){
console.log('Next image loaded');
})
.on('prevImageLoaded.simplelightbox', function(){
console.log('Prev image loaded');
})
.on('changed.simplelightbox', function(){
console.log('Image changed');
})
.on('nextDone.simplelightbox', function(){
console.log('Image changed to next');
})
.on('prevDone.simplelightbox', function(){
console.log('Image changed to prev');
})
.on('error.simplelightbox', function(e){
console.log('No image found, go to the next/prev');
console.log(e);
});
});
$(document).ajaxStop(function() {
var $gallery = $('.rows a').simpleLightbox();
});