web:html:formulaires:validation

Différences

Ci-dessous, les différences entre deux révisions de la page.

Lien vers cette vue comparative

Les deux révisions précédentes Révision précédente
Prochaine révision		 Révision précédente
web:html:formulaires:validation [2023/04/08 19:42] – [Propriétés des éléments] jcheronweb:html:formulaires:validation [2023/04/21 23:44] (Version actuelle) – jcheron
Ligne 195: Ligne 195:
 ==== Méthodes ==== ==== Méthodes ====
 ^Méthode ^Rôle ^ ^Méthode ^Rôle ^
-^checkValidity() | Renvoie **true** si la valeur de l'élément n'a passe la validation |+^checkValidity() | Renvoie **true** si la valeur de l'élément passe la validation |
 ^setCustomValidity(message) | Défini un message de validation personnalisé | ^setCustomValidity(message) | Défini un message de validation personnalisé |
  
 ==== Exemple ==== ==== Exemple ====
 +=== Formulaire HTML ===
 +
 <wrap info>L'attribut **novalidate** du form désactive la validation HTML5 par défaut.</wrap> <wrap info>L'attribut **novalidate** du form désactive la validation HTML5 par défaut.</wrap>
  
Ligne 209: Ligne 211:
 </form> </form>
 </sxh> </sxh>
 +=== Feuille de style CSS ===
  
 <sxh css> <sxh css>
Ligne 227: Ligne 230:
 } }
 </sxh> </sxh>
 +
 +=== Validation Javascript ===
  
 <sxh javascript> <sxh javascript>
Ligne 271: Ligne 276:
 <form id="form-js-validation" novalidate> <form id="form-js-validation" novalidate>
   <label for="mail-v">Pourriez-vous nous fournir une adresse mail ?</label>   <label for="mail-v">Pourriez-vous nous fournir une adresse mail ?</label>
-  <input type="email" id="mail-v" name="mailv">+  <input type="email" id="mail-v" name="mailv" required>
   <button>Envoyer</button>   <button>Envoyer</button>
   <div class="my-error"></div>   <div class="my-error"></div>
Ligne 302: Ligne 307:
 </html> </html>
  
 +==== Articles ====
 +
 +  * [[https://webdesign.tutsplus.com/tutorials/html5-form-validation-with-the-pattern-attribute--cms-25145|HTML5 Form validation sample]]
  • web/html/formulaires/validation.1680975736.txt.gz
  • Dernière modification : il y a 2 ans
  • de jcheron