Подскажите, как сделать модальное окно с подгрузкой контента из нужного id страницы MODX REVO

Подскажите новичку, как сделать модальное окно, что б содержимое подгрузилось с нужной страницы ID ресурса.
Может есть пошаговая статья, простым языком.

Хочу сделать подгрузку политики конфиденциальности, но именно с ресурса, а не из спрятонного текста в футере. Укоротить размер страницы хочу.

modxrevo.
Игорь
21 января 2022, 11:24
modx.pro
754
0

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

Наумов Алексей
21 января 2022, 15:46
1
+3
Например:
— ставим fancybox свежий (2.1.3 у меня)
— делаем обычную ссылку на страницу, но добавляем ей класс js-popup-content
<a href="/policy" class="js-popup-content">Политика</a>
— добавляем такой js код на сайт (используем jQuery )
$('.js-popup-content').fancybox({
        closeClick: false,
        type: 'ajax',
        helpers: {
            title   : null,
            overlay : {
                locked : false
            }
        },
        afterLoad   : function() {
            this.content = $("<div>").html(this.content).find(".page-content")[0].outerHTML;
        },
        autoSize: false
    });
из примечательного — в обработчике afterLoad мы вырезаем из загруженной страницы только текст, используя селектор .page-content в моем случае. У вас это может быть другой какой-нибудь, суть в том, чтобы этот селектор содержал в себе только текст с целевой страницы, без header и footer.
    Игорь
    22 января 2022, 14:12
    0
    Алексей, спасибо! именно то, что искал!!!
      Игорь
      22 января 2022, 14:18
      0
      А есть возможность сюда прикрутить bootstrap модальное окно и его стили, что б крестик был и ширина не 100% была на весь экран?
      Александр Мельник
      21 января 2022, 18:00
      +2
      — вешаете прослушку события click на кнопку открывающую модальное окно.
      — при наступлении события делаете ajax запрос (например через js fetch) на свой php файл
      — в php файле инициализируете modx
      — получаете содержимое ресурса (или через вызов pdoResources или через $modx->getResource)
      — делаете echo содержимого
      — получаете его в js скрипте,
      — innerHTML = 'полученный результат'
      — открываете модальное окно
        Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
        4