Загрузка ресурса в модальное окно - MODX

Александр
1K
4
1
Александр, Добрый день! Пытаюсь сделать загрузку ресурса в модальном окне, (Быстрый просмотр), всё работает как нужно, но есть некоторые проблемы, которые не получается решить, опишу всё подробно.

Создаю ресурс, название getcontent в содержимом ресурса, вызов сниппета:
[[!getContent]]
Сниппет: getContent содержимое:
<?php
if(empty($_REQUEST['id'])) return '';
	$id = $_REQUEST['id'];
	$res = $modx->getObject('modResource', $id);
	$out = $modx->getChunk('modal_content', array(
	    'image' => $res->getTVValue('image'),
            'mytv' => $res->getTVValue('mytv'),
	    'content' => $res->get('content'),
	    'crumbs' => $modx->runSnippet('pdoCrumbs', array('to' => $id, 'showHome' => 1, 'outputSeparator' => '/')),
 'prevnext' => $modx->runSnippet('pdoNeighbors', array( 'id' => $id,
 'tplNext'=> '@INLINE <li class="next link-next" onclick="getCont(this);" data-id="[[+id]]"><button>[[+menutitle]] →</button><i class="fas fa-angle-right fa-lg"></i></li>',
'tplPrev'=> '@INLINE <li class="previous link-prev" onclick="getCont(this);" data-id="[[+id]]"><i class="fas fa-angle-left fa-lg"></i> <button>← [[+menutitle]]</button></li>',
'tplWrapper'=> '@INLINE <span onclick="getCont(this);" data-id="[[+id]]">[[+prev]][[+next]]</span>',
             'showLog'=> '0',
            'sortdir'=> 'asc',
            'parents'=> '2'
        ))
));
	return $out;
Чанк: modal_content
<div class="modal-dialog" role="document">
      <div class="modal-content">
        <!-- Modal Header -->
        <div class="modal-header">
          <button type="button" class="close" data-dismiss="modal">×</button>
            <div class="modal-pdoCrumbs">[[+crumbs]]</div>
          <div class="modal-prevnext">[[+prevnext]]</div>
         </div><!-- Modal Header -->
        <!-- Modal body -->
        <div class="modal-body">
        <div class="modal-img"><img src="[[+image]]" alt="" /></div>
        <div class="modal-introtext">[[+introtext]]</div>
        <div class="modal-contents">[[+content]]</div>
        [[+mytv]]
        </div><!-- Modal body -->
        <!-- Modal footer -->
        <div class="modal-footer">
       <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
       </div><!-- Modal footer -->
         </div>
  </div>
В шаблоне:
<div id="staticBackdrop"  data-easein="bounceUpIn"  class="modal fade"  tabindex="-1" role="dialog" aria-labelledby="staticBackdropLabel" aria-hidden="true"></div>
<script>
    function getCont(i){
        var id = $(i).attr("data-id");
    	$.ajax({
		type: "POST",
		url: "/getcontent.html",
		data: "id="+id,
		success: function(content){
                   $("#staticBackdrop").html(content);
              	}
	});
}
</script>
Ссылка для вызова модального окна в чанке результатов PdoTools или mFilter2:
<a href="#staticBackdrop" class="read-more" onclick="getCont(this);" data-id="[[+id]]" data-toggle="modal">Быстрый просмотр</a>
В итоге получаем Ajax загрузку всех полей, которые указанны в сниппете, работу pdoNeighbors, следующая предыдущая и хлебные крошки pdoCrumbs.

1) Проблема в том, что иногда происходит так что при нажатии следующая или предыдущая, модальное окно закрывается, остаётся тёмный фон, происходит это не всегда, с чем это может быть связано?

2) Как в данном случае можно разделить значения поля mytv запятой? В чанке пытался обычным способом это сделать
[[+mytv:replace=`||==, `]]
но не работает.

3) Не понятен такой момент, при нажатии на следующую, происходит два запроса:

нормально ли это?

4) Вообще на сколько этот вариант для реализации быстрого просмотра, правильный с точки зрения производительности и и т.д возможно как-то проще и лучше можно сделать?

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

  1. Александр Мальцев
    06 февраля 2020, 14:50
    Здравствуйте!
    1. Попробуйте дополнительно добавить «$("#staticBackdrop").modal('show')»:
    success: function(content){
      $("#staticBackdrop").html(content);
      $("#staticBackdrop").modal('show');
    }
    2. Может быть вы в параметре вывода дополнительного поля (TV) не указали разделитель:
    ||
    3. Вы поместили лишний вызов «getCont(this);» в tplWrapper. Поэтому у вас и вызывается 2 раза.
    Уберите его:
    'tplWrapper'=> '@INLINE <span>[[+prev]][[+next]]</span>'
    4. Этот вариант вы создали из готовых сниппетов. Конечно, можно написать производительней, если этот функционал реализовать самостоятельно, но это потребует больше времени. В этом случае его можно написать конкретно под этот проект и возможно без применения различных сниппетов. Тем более в нём можно будет реализовать чтобы он выдавал данные в формате JSON, а далее в JavaScript их парсить и выводить на страницу.
    1. Александр
      06 января 2021, 17:59
      Александр, здравствуйте! Не получается не как разобраться, подскажите пожалуйста, как можно добавить в сниппет getContent в место «tv» поля компонента extendresource?
      1. Александр Мальцев
        24 января 2021, 09:26
        Привет!
        Как обычно:
        $modx->addPackage('extendresource', $modx->getOption('core_path').'components/extendresource/model/');
        
        $extendResource = $modx->getObject('extendResource',array(
          'resource' => $id,
        ));
        if (is_object($extendResource)) {
          $poletest = $extendResource->get('poletest');
          $poletest2 = $extendResource->get('poletest2');
        }
        
      2. Александр
        06 февраля 2020, 17:05
        Здравствуйте! В результате проблема с необоснованным и в внезапным закрытием модального окна решена.
        Вы правы я не указал разделитель в параметрах вывода тв, поэтому не мог разделить значения запятой. TplWrapper убрал, теперь вызывается один раз. По поводу альтернативного решения, тоже всё предельно понятно, Александр, огромное Вам спасибо.
      Войдите, пожалуйста, в аккаунт, чтобы оставить комментарий.