Apprendre comment créer sa première page web. sans logiciel de création de pages web
L'attribut d'événement onsubmit se déclenche lorsqu'un formulaire est envoyé. L'attribut d'événement onsubmit fonctionne uniquement avec l’élément:form
L'attribut d'événement onsubmit se déclenche lorsqu'un formulaire est envoyé.
L'attribut d'événement onsubmit fonctionne uniquement avec l’élément : <form>.
Syntaxe
<form onsubmit="script" >
Valeurs d'attribut
Valeur |
Description |
---|---|
script |
Le script à exécuter sur onsubmit |
Exemple : 📋 Copier le code
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>html5 demo</title> <script> function traitForm() { alert("Le formulaire a été soumis"); } </script> </head> <body> <form action="demo_form.php" onsubmit="traitForm()"> Nom: <input type="text" name="nom"><br> Prénom: <input type="text" name="pnom"><br> <input type="submit"> </form> <h2>Appuyez sur le bouton de soumition pour voir le message</h2> <p>la fonction traitForm() est déclanchée lors de la soumission du formulaire. Elle montre un message.</p> </body> </html>
<form action="demo_form.php" onsubmit="traitForm()">: Définit un formulaire avec l'attribut action indiquant où les données du formulaire doivent être envoyées lors de la soumission. L'attribut onsubmit est utilisé pour spécifier la fonction JavaScript (traitForm()) qui doit être appelée lors de la soumission du formulaire.
L'attribut d'événement onsubmit est pris en charge dans tous les principaux navigateurs.
Aucune.
Exemple : 📋 Copier le code
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Valider un formulaire</title> <script type="text/javascript"> //<![CDATA[ function valider() { // si la valeur du champ prenom est non vide if(document.this.nom.value != "") { if(document.this.pnom.value != "") { // alors on envoie le formulaire alert("Le formulaire a été soumis"); } else { // sinon on affiche un message alert("Saisissez le prénom SVP"); } } else { // sinon on affiche un message alert("Saisissez le nom SVP"); }} //]]> </script> </head> <body> <form name="this" action="" onsubmit="valider(this)"> Nom: <input type="text" name="nom"><br> Prénom: <input type="text" name="pnom"><br> <input type="submit"> </body> </html>
Ce code HTML représente un formulaire simple avec une fonction JavaScript (valider()) associée à l'événement onsubmit du formulaire. Le but de ce code est de vérifier si les champs "Nom" et "Prénom" sont renseignés avant de permettre la soumission du formulaire.