JQuery Autocomplete: Soumettre le Formulaire sur la sélection?

À l'aide de JQuery Autocomplete sur un traditionnel formulaire HTML.

D'essayer de soumettre le formulaire (à l'ancienne) lorsqu'une sélection est effectuée.

Mais la zone d'entrée est complété et puis j'ai à faire, appuyez sur "retour" d'un 2ème temps, ou cliquez sur le bouton "soumettre".

J'ai essayé quelques SORTE des exemples, mais je ne pouvais pas les faire travailler.

Comment faites-vous envoyer le formulaire automatiquement lorsque la sélection est faite?

  • en bref: définir un callbackfunction et soumettre le formulaire dans la callbackfunction avec javascript. Ne sais pas vraiment comment le faire dans le code.
InformationsquelleAutor ILT | 2010-02-04
  1. 50

    Mise à JOUR: j'ai enfin compris ça, le code ci-dessous devrait faire l'affaire. Pour une raison quelconque, le change de rappel n'a pas de travail, mais le close & select rappels de le faire. À l'aide de select est mieux, puisque close également être appelée que si le champ perd le focus.

    $(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 de rappel, qui est celle par défaut (dans le code ci-dessus) si vous traversez la saisie semi-automatique déroulant avec le clavier, et sélectionnez avec la touche entrée, l'entrée est changé avant que le formulaire est soumis. Toutefois, si vous sélectionnez avec la souris, le formulaire est soumis juste avant l'entrée est modifiée, de sorte que la valeur envoyée est juste que l'utilisateur a tapé (pas ce qu'elle a sélectionnés à partir de la saisie semi-automatique de liste déroulante). Le woraround qui semble fonctionner est:

    $("#searchField").autocomplete({
    source: "values.json",
    minLength: 2,
    select: function(event, ui) { 
        $("#searchField").val(ui.item.label);
        $("#searchForm").submit(); }
});
    • je vais avoir l'effet inverse lorsque automatique est l'envoi de mon formulaire mais je ne veux pas que ti des conseils?
    • Au lieu d'utiliser une codé en dur sélecteur vous pouvez utiliser $(this) de référence#searchField et $(this).closest('form') pour #searchForm comme suggéré dans le stackoverflow.com/a/10650149/1538221
    InformationsquelleAutor bjudson
  2. 7
    $( "#searchField" ).result(function(event, data, formatted) {
  $(this).closest("form").submit();
});

    La searchField est déjà rempli avec le champ sélectionné, donc pas besoin de le faire dans cette fonction.

    La documentation officielle: http://docs.jquery.com/Plugins/Autocomplete/result#handler

    InformationsquelleAutor tarkeshwar
  3. 7

    Je ne pouvais pas commenter la réponse de @handsofaten je vais donc ajouter à sa réponse ici. Il peut être plus judicieux d'utiliser valeur plutôt que étiquette que, dans certains cas, mon cas, l'étiquette n'est pas ce que l'utilisateur puisse effectuer une recherche dans la base de données avec.

    $("#searchField").autocomplete({
source: "values.json",
minLength: 2,
select: function(event, ui) { 
    $("#searchField").val(ui.item.value);
    $("#searchForm").submit(); }
});
    InformationsquelleAutor Crob
  4. 0

    Vous soumettez votre champ sélectionné en appelant le bouton Soumettre ID dans ce domaine , même si le code est dans une autre page aussi.

     document.getElementById('submit').click();
    InformationsquelleAutor MD Shahrouq
  5. -3
      select: function( event, ui ) {

          if(ui.item){

           $(event.target).val(ui.item.value);

    }

           $(event.target.form).submit();

                  });
    • envisager de fournir une explication pour votre réponse
    InformationsquelleAutor Vandana Rajput