JavaScript로 Ajax 대화 상자 열기

Sep 18 2020

use-ajax링크에 추가 하면 문서에 따라 Drupal ajax 라이브러리를 사용하여 모달을 열 수 있습니다 .

예

<a class="use-ajax" 
    data-dialog-options="{&quot;width&quot;:400}" 
    data-dialog-type="modal" 
    href="/node/1">
    First article displayed in modal dialog.
</a>

이것은 ajax 라이브러리를 사용하여 node / 1을 가져온 다음 모달로 표시합니다.

JavaScript 를 사용하여 모달을 열 수있는 JavaScript 용 Dialog API 도 있습니다 .

예

var myDialog  = Drupal.dialog(ADOMElement, settings);
myDialog.show();

이 API의 문제점은 기존 DOM 요소를 전달해야한다는 것입니다.

내 질문은 JavaScript로 모달 열기를 트리거하고 내부 Drupal ajax 라이브러리를 사용하여 실제로 콘텐츠를 가져올 수 있습니까?

예 : 이렇게 할 수 있습니까?

var myDialog  = Drupal.dialog('/node/1', {useAjax: true});
myDialog.show();

내 첫 번째 코드 블록에 따라 html 링크를 만들고 CSS로 숨긴 다음 JS로 클릭을 트리거 할 수 있지만 이것은 약간 엉망인 것 같습니다. 순수 JS를 사용하여이 작업을 트리거하는 방법이 있어야합니다.

답변

2 4k4 Sep 18 2020 at 16:48

커스텀 자바 스크립트에서 Ajax를 트리거 할 수 있습니다. JavaScript 이벤트에서 기존의 비 양식 Ajax를 트리거하는 방법을 참조하십시오.

귀하의 경우 Ajax 대화 상자 :

var ajaxSettings = {
  url: '/node/1',
  dialogType: 'modal',
  dialog: { width: 400 },
};
var myAjaxObject = Drupal.ajax(ajaxSettings);
myAjaxObject.execute();