เปิดกล่องโต้ตอบ ajax ด้วย JavaScript

Sep 18 2020

โดยการเพิ่มuse-ajaxการเชื่อมโยงเราสามารถเปิดกิริยาใช้ห้องสมุด Ajax Drupal ตามเอกสาร

เช่น

<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 เพื่อดึงข้อมูลโหนด / 1 จากนั้นแสดงในรูปแบบโมดอล

นอกจากนี้ยังมีDialog API สำหรับ JavaScriptซึ่งอนุญาตให้เปิดโมดอลโดยใช้ JavaScript

เช่น

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 ในจาวาสคริปต์ที่กำหนดเอง ดูวิธีการเรียกใช้ Ajax ที่มีอยู่และไม่ใช่รูปแบบจากเหตุการณ์ JavaScript

ในกรณีของคุณกล่องโต้ตอบ Ajax:

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