web-dev-qa-db-fra.com

Quel est l'événement déclenché après l'exécution d'une saisie semi-automatique et comment récupérer la valeur sélectionnée

J'ai un formulaire d'ajout de nœud avec une référence de terme qui utilise un widget de saisie semi-automatique.

Je veux que le terme rempli soit rempli par l'utilisateur à l'aide du widget de saisie semi-automatique.

javascriptajax
8
sel_space

Aucun événement n'est déclenché pour le moment (à partir de 7.34), mais il y a un patch sur ce problème qui devrait vous permettre d'utiliser quelque chose comme:

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

});

ou si vous utilisez une ancienne version de jQuery

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

});

Où node est l'élément sélectionné. Vous devriez pouvoir obtenir le tid à partir d'une des propriétés de cet objet.

13
Clive

Drupal 7 et 8 fournissent la génération d'événements de saisie semi-automatique jQuery sans aucun code personnalisé pour le moment.

Dans Drupal 7, l'événement autocompleteSelect a été ajouté dans Drupal # 365241 (Clive a mentionné que c'était en cours lorsqu'il a publié sa réponse.)

Drupal 8 utilise l'interface utilisateur jQuery widget de saisie semi-automatique . L'événement autocompleteclose est l'événement jQuery UI le plus similaire à l'événement D7 autocompleteSelect. Dans D8, l'événement jQuery UI autocompleteselect sera également déclenché, mais un rappel Ajax sur celui-ci ne recevra pas de valeurs d'état de formulaire mises à jour. autocompleteclose les rappels sont fournis avec des valeurs d'état de formulaire mises à jour, ce qui est généralement ce que vous voulez.

Comme les autres réponses l'ont indiqué, vous pouvez utiliser les données d'événement dans le navigateur client en utilisant un gestionnaire d'événements jQuery on ou Drupal.be ( Drupal 7 , - Drupal 8 ). Dans Drupal 7, vous utiliseriez l'événement autocompleteSelect, et sur Drupal 8 autocompleteclose.

Si vous avez besoin de la valeur dans votre PHP, un rappel Ajax peut être utilisé. Voici quelques instructions pour le faire dans Drupal 7 ou dans Drupal 8 .

3
keithm

J'avais besoin d'utiliser un comportement pour le faire fonctionner (grâce au problème mentionné par Clive, et ce commentaire: 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, '');

      });
    }
  };
1
tyler.frankenstein

Dans Drupal 8 cela a déménagé. Vous pouvez remplacer la fonctionnalité avec le code suivant.

/**
 * 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;
}

Substitue le code dans core/misc/autocomplete.js.

Ensuite, dans votre code, vous pouvez écouter

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');
    }
  })
0
Jason Yarrington