L'évènementsubmit de l'interfaceHTMLFormElement se déclenche lorsqu'un élément HTML<form> est soumis.

Notez que l'évènementsubmit se déclenche sur l'élément<form> lui‑même, et non sur un<button> ni sur un<input type="submit"> qu'il contient. Toutefois, leSubmitEvent envoyé pour indiquer que l'action de soumission a été déclenchée comprend une propriétésubmitter, qui est le bouton invoqué pour déclencher la requête de soumission.

L'évènementsubmit se déclenche lorsque :

• l'utilisateur·ice clique sur unbouton de soumission,
• l'utilisateur·ice appuie surEntrée lors de la saisie dans un champ (par exemple,<input type="text">) dans un formulaire,
• un script appelle la méthodeform.requestSubmit()

En revanche, l'évènement n'estpas envoyé au formulaire lorsqu'un script appelle directement la méthodeform.submit().

Syntaxe

Utilisez le nom de l'évènement dans des méthodes commeaddEventListener(), ou définissez une propriété gestionnaire d'évènements.

addEventListener("submit", (event) => { })onsubmit = (event) => { }

Type d'évènement

Un objetSubmitEvent. Hérite deEvent.

Propriétés de l'évènement

En plus des propriétés listées ci‑dessous, cette interface hérite des propriétés de son interface parente,Event.

submitterLecture seule

Un objetHTMLElement qui identifie le bouton ou l'autre élément utilisé pour déclencher la soumission du formulaire.

Exemples

Cet exemple utiliseEventTarget.addEventListener() pour écouter la soumission d'un formulaire, enregistre leEvent.timeStamp actuel à chaque occurrence, puis empêche l'action par défaut de soumission du formulaire.

HTML

<form>  <label>Champ de test&nbsp;: <input type="text" /></label>  <br /><br />  <button type="submit">Soumettre le formulaire</button></form><p></p>

JavaScript

const form = document.getElementById("form");const log = document.getElementById("log");function logSubmit(event) {  log.textContent = `Formulaire soumis ! Horodatage : ${event.timeStamp}`;  event.preventDefault();}form.addEventListener("submit", logSubmit);

Résultat

Spécifications

Compatibilité des navigateurs

Voir aussi

• L'élément HTML<form>
• Évènement lié :invalid