scriptaculous ajax autocomplete réponse vide

Question

Je travaille avec l'ajax-autocompleter qui fonctionne très bien. Mon but est de rediriger une fonction d'édition pour un élément existant ou une fonction de création d'un élément introuvable.

J'insère un identifiant spécifique dans chaque li et je peux donc l'utiliser pour la fonction d'édition avec une option afterUpdateElement.

Mais si aucun résultat n'est trouvé, la liste est vide et je ne trouve aucun moyen de dire au script afterUpdateElement qu'aucun résultat n'a été trouvé. En effet, aucun afterUpdateElement n'est appelé, car il n'y a pas de sélection. AfterUpdateElement est donc inutile & # 8230;

Je pensais à tester la valeur complète envoyée par la requête ajax. Mais je n'ai pas trouvé comment l'attraper.

Answer 1

Alors, j'ai enfin trouvé un moyen de vérifier si les résultats ont été sélectionnés ou non (avec l'aide de Gwyohm):

1. Tout d'abord, nous avons créé un champ caché qui enregistrera si un résultat a été sélectionné (vrai / faux). Par défaut, il est défini sur FALSE.
2. afterUpdateElement n'est utilisé qu'après une sélection. Nous utilisons donc cet objet aferUpdateElement pour transformer notre champ masqué en VRAI.

3. Si l'utilisateur modifie la valeur du champ de recherche pour une nouvelle valeur non sélectionnée, aucun afterUpdateElement n'est utilisé et notre valeur cachée est toujours définie sur TRUE. La solution à ce problème consiste à écouter une touche enfoncée. Si une touche est enfoncée, le champ caché redevient FALSE. Cela fonctionne pour toutes les touches, même la touche Entrée utilisée pour effectuer une sélection. Il s’agit donc d’une exception que nous devrions supprimer de notre programme d’écoute des touches. Pour finir, jetons un coup d’œil à notre fonction supplémentaire:

     

   $ (champ id-de-texte) .observe ("keyup", fonction (e) {

        

       

   if (window.event) keycode = window.event.keyCode;
       sinon si (e) keycode = e.which;
       if (code clé! = 13) {

            

         

   $ (id-of-hidden-field) .value = " FALSE " ;;

       

            

   }

     

        

   }. bindAsEventListener ($ (id-of-text-field)));

Nous pouvons ensuite utiliser le champ masqué pour savoir si la valeur de texte doit être modifiée ou créée ...

Attention: avec cette solution, si l’utilisateur tape une valeur correspondant à une valeur existante sans la sélectionner, elle sera considérée comme une nouvelle valeur et donnera lieu à une entrée en double si vous ajoutez cette valeur à votre base de données. (mais cela me convenait, car je travaillais avec des noms et deux personnes différentes peuvent avoir le même nom ...)

Answer 2

Vous pouvez essayer de remplacer la méthode updateChoices comme suit:

Ajax.Autocompleter.prototype.updateChoices =  function (choices) {
if(!this.changed && this.hasFocus) {

      if(!choices) {
        //do your "new item" thing here
      }
      else {
         this.update.innerHTML = choices;
         Element.cleanWhitespace(this.update);
         Element.cleanWhitespace(this.update.down());

         if(this.update.firstChild && this.update.down().childNodes) {
           this.entryCount =
             this.update.down().childNodes.length;
           for (var i = 0; i < this.entryCount; i++) {
             var entry = this.getEntry(i);
             entry.autocompleteIndex = i;
             this.addObservers(entry);
           }
         } else {
           this.entryCount = 0;
         }

         this.stopIndicator();
         this.index = 0;

         if(this.entryCount==1 && this.options.autoSelect) {
           this.selectEntry();
           this.hide();
         } else {
           this.render();
         }
      }
   }
}

Ce n’est pas une bonne idée d’écraser dans controls.js. Au lieu de cela, vous pouvez ajouter ceci à un nouveau fichier .js et l'inclure après la bibliothèque.

EDIT: pff .. désolé pour les retraits incorrects, mais il s'agit d'un copier / coller à partir de TextMate et ses onglets sont combinés avec des espaces. J'espère que vous obtenez le point cependant. La seule chose que j'ai ajoutée était le

      if(!choices) {
        //do your "new item" thing here
      }
      else {}

bloquer. De plus, je n'ai pas testé le code, mais je pense que cela devrait fonctionner.