ใช้ ajax เพื่อบันทึกรูปแบบโมดอล / ไดอะล็อกแทนการโหลดหน้าซ้ำ

ฉันกำลังมองหาวิธีบันทึกฟอร์มโมดอลและไดอะล็อกผ่าน ajax แทนที่จะเปลี่ยนเส้นทางผู้ใช้หลังจากส่งฟอร์ม อาแจ็กซ์เป็นดินแดนที่ไม่รู้จักสำหรับฉัน

ฉันพบหัวข้อที่น่าสนใจหลายหัวข้อที่นี่แล้ว:

กล่องโต้ตอบ jQuery UI พยายามส่งแบบฟอร์มโดยใช้ AJAX เปลี่ยนเส้นทางฉันไปยังหน้าแบบฟอร์มจริงแทนการส่ง AJAX

จะปิดโมดอลหลังจากส่งแบบฟอร์มได้อย่างไร

ฉันลองคำตอบทั้งหมดที่แสดงที่นั่น แต่ไม่มีโชค ฉันใช้ Drupal 9 และดูเหมือนว่ารหัสอาจแตกต่างกันเล็กน้อยระหว่างเวอร์ชัน 8 และ 9 ฉันพยายามค้นหาในหน้าเอกสารบน drupal.org แต่ไม่พบสิ่งที่มีประโยชน์กับกรณีของฉัน

สำหรับใครก็ตามที่ใส่ใจ ฉันทำให้มันใช้งานได้กับโค้ดต่อไปนี้ในโมดูล 'cs_modals' ที่กำหนดเองของฉัน:

 /**
 * ใช้ hook_form_alter()
 */
ฟังก์ชัน cs_modals_form_alter(&$form, \Drupal\Core\Form\FormStateInterface $form_state, $form_id) {
    $request = \Drupal::request();
    // ตรวจสอบว่าคำขอ Ajax หรือไม่
    ถ้า ($request->isXmlHttpRequest()) {
      $form['actions']['submit']['#ajax']['callback'] = '_cs_modals_id_submit_ajax_callback';
    }
}

/**
 * การโทรกลับ Ajax แบบกำหนดเอง
 */
ฟังก์ชัน _cs_modals_id_submit_ajax_callback (อาร์เรย์ &$form, FormStateInterface $form_state) {
  // ถ้าฟอร์มถูกต้อง ให้ปิดไดอะล็อก
  ถ้า (!$form_state->hasAnyErrors()) {
    $response = ใหม่ \Drupal\Core\Ajax\AjaxResponse();
    $response->addCommand(ใหม่ \Drupal\Core\Ajax\CloseDialogCommand());
    ส่งคืน $response;
  }
  // มิฉะนั้นให้โทรกลับ #ajax เริ่มต้น
  $form_object = $form_state->getFormObject();
  $response = $form_object->submitAjaxForm($form, $form_state) ;
  ส่งคืน $response;
}

ตอนนี้ ทุกแบบฟอร์มใน modal จะถูกส่งผ่าน Ajax ตอนนี้ฉันกำลังมองหาวิธีปิด modal โดยอัตโนมัติเมื่อส่งแบบฟอร์มสำเร็จหรือแสดงข้อความแสดงข้อผิดพลาดผ่าน Ajax เมื่อฟิลด์ที่จำเป็นอย่างน้อยหนึ่งฟิลด์ไม่มีค่า ความช่วยเหลือใด ๆ ที่จะได้รับการชื่นชม!