AJAX загрузка $msProduct.content в модальном окне

Приветствую! Подскажите варианты решения задачи или в каком направлении искать. Буду признателен за любую помощь.

Каким образом можно сделать быстрый просмотр карточки товара miniShop2 в модальном окне с AJAX загрузкой, надо выводить чанк $msProduct.content по клику на кнопку. Модуль QuickView не подходит, из-за необходимости использовать на десятках сайтов с однотипной структурой без корзины.

Пробовал сделать на Bootstrap и fancyBox, метод рабочий, если бы не [[!msGallery]], такой подход некорректно загружает галерею и выводит только изображения без разметки.


Для ясности, пример реализации на Bootstrap:
Есть такой момент, когда $msProduct.content загружается внутри <body></body>, галерея отображается корректно. Пробовал разные костыли, в т.ч. подставлять <body></body> непосредственно в модальное окно.

//Кнопка вызова
<button data-target="#product" data-toggle="modal" data-load-remote="/page.html" data-remote-target=".modal-body">Просмотр</button>

//Модальное окно
<div id="product" class="modal fade" tabindex="-1" role="dialog">
  <div class="modal-dialog modal-lg" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
      </div>
      <div class="modal-body">
          	//сюда должен подгружаться контент
      </div>
    </div>
  </div>
</div>

//JS
<script type="text/javascript">
     jQuery(function ($) {
     $('[data-load-remote]').on('click',function(e) {
     e.preventDefault();
     var $this = $(this);
     var remote = $this.data('load-remote');
     if(remote) {
         $($this.data('remote-target')).load(remote + " #content");
     }
 });
Alexey
Alexey
16 марта 2017, 17:57
modx.pro
2 845
+1

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

Михаил
Михаил
17 марта 2017, 07:31
0
quickview
    Alexey
    Alexey
    17 марта 2017, 12:45
    0
    Решение удобное для 1-3 сайтов. Когда их пара десятков, покупать для каждого, очевидно, не вариант.

    Простейшее решение сделал на Bootstrap, исправить загрузку галереи в этом случае не получилось, да, можно убрать все лишнее со страницы товара и грузить ее полностью, в этом случае если галерея находится внутри тега <body></body>, выводится корректно. Страницы товара используются как одностраничные сайты. Костыльное решение, создать дубли каждого товара с разными шаблонами, либо заменить галерею.
      PG
      PG
      17 марта 2017, 18:03
      +1
      Напишите в скайп, контакты в профиле.
    Олег
    Олег
    18 марта 2017, 14:28
    +1
    Для работы ms2gallery (по умолчанию там используется fotorama) достаточно еще раз инициализировать галерею, скорее всего у нее есть такой метод.
      Борис И
      Борис И
      18 марта 2017, 16:01
      0
      Недавно поставил у себя, вот это работает без javascript, посмотрите можт быть подойдет.
        Alexey
        Alexey
        18 марта 2017, 16:33
        0
        Не совсем то, со своей функцией вполне неплохо справляются модальные окна Bootstrap. Дело не в них, а в правильном выводе чанков и сниппетов как понимаю.
        Raimei
        Raimei
        18 марта 2017, 18:32
        +1
        Просто переинициализируйте фотораму как скрипт, если она у вас стоит.
          Alexey
          Alexey
          18 марта 2017, 19:38
          +2
          уже сделали, вопрос решен.
        Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
        10