jQuery Saisie semi-automatique avec plusieurs entrées

Question

J'ai un champ de saisie semi-automatique que je souhaite compléter en fournissant également un menu déroulant pour les catégories, dans l'espoir que cela facilitera encore la recherche. Cela prendrait l'identifiant de la catégorie à partir de la liste déroulante, puis transmettrait cela avec le texte de recherche à ma fonction de saisie semi-automatique côté serveur.

J'utilise le plugin autocomplete jQuery trouvé ici:

http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

La page de démonstration est ici:

http://jquery.bassistance.de/autocomplete/demo/

Peut-être est déjà expliqué dans la démo en quelque sorte, mais je Je ne le vois tout simplement pas. Je peux extraire les données de JSON et les diviser en plusieurs champs.

Peu importe, mais j'utilise également ASP.NET MVC.

Answer 1

Le premier paramètre du plug-in autocomplete peut être un tableau ou un URL. Tout ce que vous auriez à faire est de fournir votre identifiant de catégorie en tant que paramètre de chaîne de requête à votre fonction de saisie semi-automatique.

var selectedCategory = $('.categories').val(); 
var query = ''; 
if (selectedCategory !== 0) 
{ 
    query = '?category=' + selectedCategory; 
} 
$("#suggest4").autocomplete('search_service.svc' + query, { 
    // options 
}); 

Espérons que cela aide.

Answer 2

La réponse précédente est 1/2 correcte. Le problème est que lorsque .autocomplete() est appelé, la requête url + est immédiatement évaluée, ce qui signifie que la valeur de la catégorie sélectionnée sera TOUJOURS utilisée lorsque la saisie semi-automatique est appelée. Cela signifie que si l'utilisateur a sélectionné une catégorie différente, la nouvelle valeur ne sera pas transmise sur la ligne de commande de la requête. Voir cette entrée de blog pour mon correctif qui vous permet de passer une fonction au lieu d'une URL, et toujours utiliser le code similaire à l'exemple de Bendewey ci-dessus.

jquery-autocomplete-other-fields

Note: J'ai essayé ici poster le patch, mais il était tout foiré.

Eric

Answer 3

meilleure solution est d'ajouter la fonction de rappel extraParams à votre params

extraParams: { 
    data: function(){ return new Date().getTime() } 
},