web-dev-qa-db-fra.com

Javascript sélectionnez onchange = 'this.form.submit ()'

J'ai un formulaire avec une sélection et quelques entrées de texte. J'aimerais que le formulaire soit soumis lorsque la sélection est modifiée. Cela fonctionne très bien en utilisant ce qui suit:

onchange="this.form.submit()"

Toutefois, si le formulaire contient également un bouton d'envoi, le formulaire n'est pas envoyé lorsque la sélection est modifiée. Je suppose une sorte de conflit.

Quelles sont mes options ici?

Dois-je utiliser quelque chose comme $(this.form).trigger("submit") à la place?

30
JonoB

Vous devriez pouvoir utiliser quelque chose de similaire à:

$('#selectElementId').change(
    function(){
         $(this).closest('form').trigger('submit');
         /* or:
         $('#formElementId').trigger('submit');
            or:
         $('#formElementId').submit();
         */
    });
54
David Thomas

Mes compétences en débogage psychique me disent que votre bouton d'envoi est nommé submit.
Donc, form.submit fait référence au bouton plutôt qu'à la méthode.

Renommez le bouton en quelque chose d'autre pour que form.submit fait à nouveau référence à la méthode.

25
SLaks

Si vous utilisez jQuery, c'est aussi simple que cela:

 $('#mySelect').change(function()
 {
     $('#myForm').submit();
 });
10
Tejs

Il existe plusieurs façons de procéder.

Les éléments savent à quelle forme ils appartiennent, vous n'avez donc pas besoin d'envelopper this dans jquery, vous pouvez simplement appeler this.form Qui retourne l'élément de formulaire. Ensuite, vous pouvez appeler submit() sur un élément de formulaire pour le soumettre.

  $('select').on('change', function(e){
    this.form.submit()
  });

documentation: https://developer.mozilla.org/en-US/docs/Web/API/HTMLInputElement

5
Blair Anderson

Utilisation :

<select onchange="myFunction()">

    function myFunction() {
        document.querySelectorAll("input[type=submit]")[0].click();
    }
0
Wasif Shahjahan

Liez-les à l'aide de jQuery et faites-les gérer par jQuery: http://jsfiddle.net/ZmxpW/ .

$('select').change(function() {
    $(this).parents('form').submit();
});
0
pimvdb