Utilisation de la saisie semi-automatique jQuery avec le problème de synchronisation Validator onBlur

Question

Voici mon problème, j'ai un élément d'entrée dans un formulaire qui implémente jQuery.Autocomplete et jQuery.validate, tout fonctionnant normalement sauf lorsque je clique sur un élément dans la liste de saisie semi-automatique pour le sélectionner . Ce qui se passe, c'est que la validation se produit avant que la saisie semi-automatique ne définisse sa valeur. Comme la validation se produit sur onBlur et que vous venez de cliquer sur un élément de la liste de saisie semi-automatique, les flous de flou et la validation se produisent une fraction de seconde avant que l'entrée ne soit remplie avec sa nouvelle valeur. Cela ne me dérangerait pas une double validation si c'était côté client, mais il se trouve que j'exécute une validation ajax distante coûteuse sur ce champ, donc j'aimerais vraiment résoudre ce problème de la bonne façon. Mon premier réflexe est d'utiliser tous les événements de validation onBlur par le biais d'une fonction qui expire 10ms plus tard, en retournant essentiellement l'ordre des événements. Mais, pense, ce qui signifie déchirer dans le code jQuery.Validate.js, que je préfère ne pas faire.

Des idées?

Answer 1

J'ai été capable de faire fonctionner cela mais peut-être pas aussi élégamment que je l'aurais aimé. Idéalement, j'aurais aimé appeler le prototype ou la version par défaut de onfocusout à partir d'une fermeture de temporisation, mais je n'ai pas été capable de comprendre comment le référencer à partir de cette portée.

L'approche que j'ai prise à la place consistait à remplacer la méthode onfocusout par sa copie de code/collée dans une fermeture de délai. Le seul autre changement était de changer les références de ceci à travailler dans les différentes limites de la fermeture de timeout.

$("#aspnetForm").validate({ 
     success: "valid", 
     onkeyup: "false", 
     onfocusout: 
      function(element) { 
       //Delay validation so autocomplete can fill field. 
       var _this = this; 
       setTimeout(function() { 
        if (!_this.checkable(element) && (element.name in _this.submitted || !_this.optional(element))) 
         _this.element(element); 
        _this = null; 
       }, 250); 
      } 
    }); 

N'hésitez pas à poster des améliorations.