Как вывести форму drupal 9 в модальном окне fancybox?

Question

Сделал роут

  intrend_module.form_ajax_response:
  path: '/getform'
  defaults:
    _controller: '\Drupal\intrend_module\Controller\PageController::getForm'
  requirements:
    _permission: 'access content'

И контроллер для него.

public function getForm() {

  $webform = \Drupal::entityTypeManager()->getStorage('webform')->load('ostalis_voprosy_');
  $webform = $webform->getSubmissionForm();


  $response = new AjaxResponse();

  $response->addCommand(new HtmlCommand('#webform-wrapper',$webform));

  return $response;

}

Получаю в ответ json.

Если из json вытащить html формы, то она появляется, но под нее не подружаются скрипты и прочее.

Fancybox.bind("[data-fancybox]", {
        on: {
            reveal: (fancybox, slide) => {
                console.log(fancybox);
                console.log(slide);
                if (slide.xhr && slide.xhr.response){
                    let response = JSON.parse(slide.xhr.response);
                    response.forEach(function(responseCommand){
                        if (responseCommand['selector'] == '#webform-wrapper'){
                            slide["$content"].innerHTML = responseCommand.data;
                        }
                    })
                }
            },
        },
    })

Вызываю данный роут через

<a class="rbtn" data-fancybox data-type="ajax" href="/getform?form=webform">Test</a>

Если изменить вызов на

<a class="rbtn use-ajax"  href="/getform?form=webform">Test</a>

То приходит рабочая форма (в блок id = webform-wrapper);

Как я понял, use-ajax выполняет все команды из ответа, из за чего все скрипты начинают работать.

Но в коде не нашел, как именно выполнить эти команды

Может быть у кого нибудь есть пример вывода формы или как выпонить все команды из json ответа ?

Answer 1

Решил данный вопрос.

JS прописал так

 Fancybox.bind("[data-fancybox]", {
        on: {
            reveal: (fancybox, slide) => {
                if (slide.xhr && slide.xhr.response){
                    let response = JSON.parse(slide.xhr.response);

                    var ajaxObject = Drupal.ajax({
                        url: '',
                        base: false,
                        element: false,
                        progress: false
                    });

                    ajaxObject.success(response, 'success');
                }
            },
        },
    })

в контроллере поменял addCommand

$response->addCommand(new HtmlCommand('.fancybox__content',$webform));

Получилось, что я обновил данные fancybox в момент, когда блок fancybox__content уже сгенерирован.

Таким образом сработала команда HtmlCommand.

Возможно мой вариант кому нибудь поможет )

БЛОГ НА HUSL

Как вывести форму drupal 9 в модальном окне fancybox?

Ответы (1 шт):