JQuery Autocomplete: Soumettre le Formulaire sur la sélection?
utilisant jQuery Autocomplete sur un format HTML traditionnel.
une tentative de soumettre le formulaire (à l'ancienne) lorsqu'une sélection est effectuée.
mais la boîte de saisie est remplie et ensuite je dois faire "return" une deuxième fois, ou cliquez sur le bouton Soumettre.
j'ai essayé quelques exemples, mais je n'ai pas pu les faire fonctionner.
Comment soumettre le formulaire automatiquement lorsque la sélection est faite?
5 réponses
mise à jour: j'ai enfin compris ça, le code ci-dessous devrait faire l'affaire. Pour une raison quelconque, le change
rappel n'a pas de travail, mais l' close
& select
rappels de le faire. En utilisant select
est mieux, car close
sera aussi appelé si le champ perd sa concentration.
$(function() {
$("#searchField").autocomplete({
source: "values.json",
select: function(event, ui) {
$("#searchForm").submit(); }
});
});
UNE AUTRE MISE À JOUR: Ok, il y a aussi un problème avec le select
callback, qui est celui par défaut (dans le code ci-dessus) si vous traversez l'autocomplete drop down avec le clavier et sélectionnez avec la touche entrée, l'entrée est changé avant que le formulaire est soumis. Cependant, si vous le sélectionnez avec la souris, le formulaire est soumis juste avant que l'entrée soit changée, de sorte que la valeur soumise est juste ce que l'Utilisateur a tapé (et non pas ce qu'elle a choisi dans le dropdown autocomplete). Le woraround qui semble fonctionner est:
$("#searchField").autocomplete({
source: "values.json",
minLength: 2,
select: function(event, ui) {
$("#searchField").val(ui.item.label);
$("#searchForm").submit(); }
});
$( "#searchField" ).result(function(event, data, formatted) {
$(this).closest("form").submit();
});
Le searchField est déjà rempli avec le champ sélectionné, donc pas besoin de le faire dans cette fonction.
documents officiels:http://docs.jquery.com/Plugins/Autocomplete/result#handler
Je ne pouvais pas commenter la réponse de @handsofaten donc je vais ajouter à sa réponse ici. Peut-être plus logique d'utiliser valeur plutôt que étiquette comme dans certains cas, mon cas, l'étiquette n'est pas ce que l'utilisateur puisse effectuer une recherche dans la base de données.
$("#searchField").autocomplete({
source: "values.json",
minLength: 2,
select: function(event, ui) {
$("#searchField").val(ui.item.value);
$("#searchForm").submit(); }
});
vous soumettez votre fichier sélectionné en appelant le bouton Soumettre ID dans ce champ , même si le code est aussi dans une autre page.
document.getElementById('submit').click();
select: function( event, ui ) {
if(ui.item){
$(event.target).val(ui.item.value);
}
$(event.target.form).submit();
});