Formulaire de soumission JavaScript en un clic

Ammar Ali 12 octobre 2023
  1. Soumettre un formulaire en cliquant sur un lien et en utilisant la fonction submit() en JavaScript
  2. Soumettre un formulaire en cliquant sur un bouton et en utilisant la fonction submit() en JavaScript
Formulaire de soumission JavaScript en un clic

Ce tutoriel expliquera comment soumettre un formulaire en utilisant la fonction submit() en JavaScript.

Soumettre un formulaire en cliquant sur un lien et en utilisant la fonction submit() en JavaScript

En JavaScript, vous pouvez créer un formulaire en utilisant la balise form, vous pouvez donner un identifiant au formulaire en utilisant l’attribut id, et après cela, vous devez choisir une méthode pour soumettre votre formulaire comme, vous pouvez soumettre le formulaire lorsqu’un lien ou un bouton est cliqué. Maintenant, il existe deux méthodes pour soumettre un formulaire, et vous pouvez soit le faire à l’intérieur du code HTML en utilisant l’attribut onclick soit le faire à l’intérieur du JavaScript. Par exemple, soumettons un formulaire à l’intérieur du HTML en utilisant l’attribut onclick. Voir le code ci-dessous.

<form id="FormId">
  <a href="FormLink" id = "LinkID" onclick="document.getElementById('FormId').submit();"> SubmitForm </a>
</form>

Vous pouvez modifier l’identifiant form et l’identifiant du lien dans le code ci-dessus selon vos besoins. Cette méthode n’est pas recommandée car vous mélangez du code HTML avec du code JavaScript. Vous pouvez également le faire séparément en JavaScript en utilisant l’identifiant du formulaire et du lien. Par exemple, effectuons l’opération ci-dessus en utilisant un JavaScript séparé. Voir le code ci-dessous.

var myform = document.getElementById('FormId');
document.getElementById('LinkId').addEventListener('click', function() {
  myform.submit();
});

Cette méthode est recommandée car le HTML et le JavaScript sont dans des fichiers séparés. Notez que vous devez utiliser l’identifiant du formulaire et l’identifiant du lien que vous avez définis dans le code HTML pour obtenir ces éléments en JavaScript. Le formulaire sera soumis lorsque le lien sera cliqué.

Soumettre un formulaire en cliquant sur un bouton et en utilisant la fonction submit() en JavaScript

Vous pouvez utiliser un bouton pour soumettre un formulaire. Il existe deux méthodes pour soumettre un formulaire, et vous pouvez soit le faire à l’intérieur du code HTML en utilisant l’attribut onclick soit le faire à l’intérieur du JavaScript. Par exemple, soumettons un formulaire à l’intérieur du HTML en utilisant l’attribut onclick. Voir le code ci-dessous.

<form id="FormId">
  <button id = "ButtonId" onclick="document.getElementById('FormId').submit();"> SubmitForm </button>
</form>

Semblable à la méthode ci-dessus, cette méthode n’est pas recommandée car vous mélangez du code HTML avec du code JavaScript. Faisons l’opération ci-dessus en utilisant JavaScript séparé.

var myform = document.getElementById('FormId');
document.getElementById('ButtonId').addEventListener('click', function() {
  myform.submit();
});
Auteur: Ammar Ali
Ammar Ali avatar Ammar Ali avatar

Hello! I am Ammar Ali, a programmer here to learn from experience, people, and docs, and create interesting and useful programming content. I mostly create content about Python, Matlab, and Microcontrollers like Arduino and PIC.

LinkedIn Facebook

Article connexe - JavaScript Form