เหตุการณ์ที่เรียกใช้หลังจากการเติมข้อความอัตโนมัติทำงานและวิธีเรียกคืนค่าที่เลือก


8

ฉันมีโหนดเพิ่มฟอร์มด้วยการอ้างอิงคำที่ใช้วิดเจ็ตเติมข้อความอัตโนมัติ

ฉันต้องการ "tid" ของคำที่เติมโดยผู้ใช้โดยใช้วิดเจ็ตการเติมข้อความอัตโนมัติ

คำตอบ:


13

ไม่มีเหตุการณ์ที่ถูกเรียกในขณะนี้ (ณ วันที่ 7.34) แต่มีการแก้ไขในเรื่องนี้ที่จะช่วยให้คุณใช้สิ่งที่ชอบ:

$('#input-id').on('autocompleteSelect', function(event, node) {

});

หรือถ้าคุณใช้ jQuery เวอร์ชันเก่า

$('#input-id').bind('autocompleteSelect', function(event, node) {

});

nodeรายการที่เลือกอยู่ที่ไหน คุณควรจะได้รับtidคุณสมบัติอย่างใดอย่างหนึ่งจากวัตถุนั้น


ขอบคุณสำหรับการตอบกลับฉันพบวิธีแก้ไขปัญหาอื่นที่อธิบายไว้ในโพสต์บล็อกนี้: brockboland.com/drupaldork/2013/01//
sel_space

@Clive: นี่เป็นงานสำหรับการเติมข้อความค้นหา api หรือไม่ฉันมีข้อความค้นหาที่นี่drupal.stackexchange.com/questions/286399/…
Suraj

3

Drupal 7 และ 8 ให้การสร้างเหตุการณ์เติมข้อความอัตโนมัติ jQuery โดยไม่ต้องมีรหัสที่กำหนดเองในขณะนี้

ใน Drupal 7 autocompleteSelectเหตุการณ์ถูกบันทึกอยู่ใน Drupal ปัญหา# 365241 (ไคลฟ์พูดถึงสิ่งนี้อยู่ในระหว่างดำเนินการเมื่อเขาโพสต์คำตอบ)

Drupal 8 การนำมาใช้ประโยชน์ jQuery UI การเติมข้อความอัตโนมัติวิดเจ็ต autocompletecloseเหตุการณ์เป็นเหตุการณ์ jQuery UI ส่วนใหญ่คล้ายกับ D7 autocompleteSelectเหตุการณ์ ใน D8 autocompleteselectเหตุการณ์jQuery UI จะถูกทริกเกอร์ด้วยเช่นกัน แต่การโทรกลับของ Ajax นั้นจะไม่ได้รับค่าสถานะแบบฟอร์มที่อัปเดต autocompletecloseการเรียกกลับมาพร้อมกับค่าสถานะแบบฟอร์มที่ปรับปรุงซึ่งโดยปกติจะเป็นสิ่งที่คุณต้องการ

ตามคำตอบอื่น ๆ ที่ระบุไว้คุณสามารถใช้ข้อมูลเหตุการณ์ในเบราว์เซอร์ไคลเอ็นต์โดยใช้jQuery บนตัวจัดการเหตุการณ์หรือ Drupal.behaviors ( Drupal 7 , Drupal 8 ) ใน Drupal 7 คุณจะใช้autocompleteSelectเหตุการณ์และ Drupal autocompleteclose8

หากคุณต้องการค่าในโค้ด PHP ของคุณอาจใช้การเรียกกลับ Ajax นี่คือเส้นทางบางอย่างสำหรับวิธีการทำเช่นนี้ในมีDrupal 7หรือในDrupal 8


1

ฉันต้องการใช้พฤติกรรมเพื่อให้มันทำงานได้ (ต้องขอบคุณปัญหาที่กล่าวถึงโดย Clive และความคิดเห็นนี้: https://www.drupal.org/node/365241#comment-9575707 ):

Drupal.behaviors.autocompleteSupervisor = {
    attach: function (context) {
      $('#edit-field-foo-und-0-target-id', context).bind('autocompleteSelect', function(event, node) {

        // Do custom stuff here...
        var entity_id = $(this).val().replace($(node).text().trim(), '').replace(/\(|\)| /g, '');

      });
    }
  };

0

ใน Drupal 8 สิ่งนี้ได้ย้ายไปแล้ว คุณสามารถแทนที่การทำงานด้วยรหัสต่อไปนี้

/**
 * Handles an autocompleteselect event.
 *
 * Override the autocomplete method to add a custom event.
 *
 * @param {jQuery.Event} event
 *   The event triggered.
 * @param {object} ui
 *   The jQuery UI settings object.
 *
 * @return {bool}
 *   Returns false to indicate the event status.
 */
Drupal.autocomplete.options.select = function selectHandler(event, ui) {
  var terms = Drupal.autocomplete.splitValues(event.target.value);
  // Remove the current input.
  terms.pop();
  // Add the selected item.
  if (ui.item.value.search(',') > 0) {
    terms.push('"' + ui.item.value + '"');
  }
  else {
    terms.push(ui.item.value);
  }
  event.target.value = terms.join(', ');
  // Fire custom event that other controllers can listen to.
  jQuery(event.target).trigger('autocomplete-select');
  // Return false to tell jQuery UI that we've filled in the value already.
  return false;
}

core/misc/autocomplete.jsการแทนที่รหัสใน

จากนั้นในรหัสของคุณคุณสามารถฟัง

var field = jQuery('<field-selector>');

var lastField = ''
field.on('autocomplete-select', function() {
    console.log("autocompleteSelect");
    // Check that field actually changed.
    if ($(this).val() != lastValue) {
      lastValue = $(this).val();
      console.log('The text box really changed this time');
    }
  })

การใช้การแทนที่ของแบบฟอร์มนี้ไม่ใช่วิธีปฏิบัติที่ดีที่สุด หากมีการแทนที่สองรายการในไซต์ที่มีชื่อเหตุการณ์แตกต่างกันเล็กน้อยเช่น 'autocomplete-select' และ 'autocompleteSelect' ผู้ที่ได้รับมอบหมายครั้งสุดท้ายจะมีความสำคัญกว่าและเหตุการณ์แรกจะไม่ถูกเรียก นอกจากนี้ Drupal 7 และ 8 ยังกระตุ้นเหตุการณ์ที่เหมาะสมโดยไม่มีรหัสเพิ่มเติม ดูคำตอบของฉันdrupal.stackexchange.com/a/228150/2272
keithm

Drupal.autocomplete.options.select = ฟังก์ชั่น selectHandler (เหตุการณ์ ui) {ล้มเหลวเมื่อไม่มีฟิลด์เติมข้อความอัตโนมัติในหน้าเฉพาะ คุณต้องใช้การตรวจสอบเพื่อให้แน่ใจว่ามีช่องกรอกข้อมูลอัตโนมัติอยู่ มิฉะนั้นคุณจะสั่งห้าม JS ของคุณ คุณจะได้รับข้อผิดพลาดดังกล่าว:> Uncaught TypeError: ไม่สามารถอ่านตัวเลือกคุณสมบัติ 'ของไม่ได้กำหนดที่ node-form.js: 94 ที่ node-form.js: 113
jepster
โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.