Comment faire un formulaire web soumettre automatiquement sur une liste déroulante de sélection

J'ai un formulaire dans ma page comme celle ci-dessous;

<form name="testform" id="testform" action="test.php" method="get">
  <input name="field1" id="field1" type="text" value="">
  <input name="field2" id="field2" type="text" value="">
  <select name="dropdown" id="dropdown">
    <option value="option1" selected="selected">option1</option>
    <option value="option2">option2</option>
    <option value="option3">option3</option>
  </select>
  <input type="submit" name="Submit" value="Submit" id="Submit">
</form>

Je veux le formulaire pour obtenir automatiquement envoyé lorsque l'utilisateur de sélectionner une option dans le menu déroulant. Comment puis-je le faire avec ou sans l'aide de JavaScript (avec ou sans jQuery)?

Merci d'avance... :)

blasteralfred

OriginalL'auteur blasteralfred Ψ | 2011-03-17

10

Cliquez sur (ou sélectionner)? Dans ce cas, l'utilisateur ne sera pas en mesure de faire une sélection. Tu veux sans doute dire dès que une autre option est sélectionnée. Si oui
```
<select name="dropdown" id="dropdown" onchange="this.form.submit()">
```
Si jQuery est utilisé, discrète gestionnaire d'événement changement doit être utilisé au lieu de javascript en ligne.
```
$(function(){
    $("#dropdown").change( function(e) {
        this.form.submit();
    });
});
```
Utilisation sur si les éléments de formulaire sont dynamiquement ajoutés dans les DOM
```
$(function(){
    $('#testform').on( "change", "#dropdown", function(e) {
        this.form.submit();
    });
});
```
Javascript gestion des événements ne doit jamais être effectuée en ligne.
Blunt états sont plus puissant lorsqu'il est suivi par un argument.
Juste point de. Ok, inline gestionnaires d'événements flou de la séparation des préoccupations, sont difficiles à maintenir, car ils sont saupoudré dans la source de divers modèles et ajouter le ballonnement du document, alors que discrète de gestionnaires d'événements dans un fichier externe sont mis en cache, logiquement séparées et sont généralement considérés comme des bonnes pratiques.
Cette simple question semble être à recevoir du trafic. Mise à jour de la réponse à inclure jQuery alternatives. @Chris, tout le monde est autorisé à modifier quoi que ce soit, vous êtes les bienvenus à modifier et ajouter des précisions ou des exemples.

OriginalL'auteur amit_g
7

Vous aurez besoin d'utiliser le jQuery modifier() de l'événement.
```
('#dropdown').change( function() { ('#testform').submit(); })
```
OriginalL'auteur CtrlDot

Je pense que

$('#dropdown').change(function () { $('Submit').click(); } );

fera l'affaire!

OriginalL'auteur goggin13

Ici Réponse

<form name="testform" id="testform" action="test.php" method="get">
              <input name="field1" id="field1" type="text" value="">
              <input name="field2" id="field2" type="text" value="">
              <select name="dropdown" id="dropdown" onChange="document.testform.submit()">
            <option value="option1" selected="selected">option1</option>
            <option value="option2">option2</option>
            <option value="option3">option3</option>
            </select>
  </form>

OriginalL'auteur Vinoth Kumar

Vous devez vous connecter pour publier un commentaire.