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?
Vous devriez pouvoir utiliser quelque chose de similaire à:
$('#selectElementId').change(
function(){
$(this).closest('form').trigger('submit');
/* or:
$('#formElementId').trigger('submit');
or:
$('#formElementId').submit();
*/
});
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.
Si vous utilisez jQuery, c'est aussi simple que cela:
$('#mySelect').change(function()
{
$('#myForm').submit();
});
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
Utilisation :
<select onchange="myFunction()">
function myFunction() {
document.querySelectorAll("input[type=submit]")[0].click();
}
Liez-les à l'aide de jQuery et faites-les gérer par jQuery: http://jsfiddle.net/ZmxpW/ .
$('select').change(function() {
$(this).parents('form').submit();
});