Bien écrire les formulaires HTML : Partie 1
Publi� le 1er novembre 2006

Cet article est le 1er de la série "comment qu'il est bien d'écrire bien les formulaires html" (rires). Je vais m'attacher à essayer de montrer une méthode valable et standard pour générer des formulaires dont les problématiques habituelles sont prises en compte, comme :

-  la validation des champs
-  le contrôle des erreurs
-  le remplissage des champs en cas d'erreur

A un formulaire on peut lui associer un événement spécial : le onsubmit. C'est utile pour effectuer des traitements (contrôles) avant d'activer la soumission du formulaire. ex :


<form onsubmit="return soumettre()">
...

Pour suivre les règles, cette fonction doit retourner true ou false. false empêche la validation du formulaire.


<script type="text/javascript"><!--
function
soumettre() {
    if (
erreur())
        return
false;
    else
        return
true;
}
-->
</script>

Techniquement on peut aussi la mettre dans le champ input submit.


<form>
<
input type="submit" value="Envoyer" onclick="return soumettre()">
...

Je pense qu'il convient d'utiliser plutôt la 1ère forme qui garantit que l'événement submit sera traité correctement. Je dirai pourquoi.

La deuxième forme est traitée comme suit : si soumettre=false alors le click est annulé. Cela a pour effet de ne pas soumettre le formulaire.

Imaginons maintenant que c'est le type button qui est utilisé.


<form>
<
input type="button" value="Envoyer" onclick="return soumettre()">
...

Le formulaire est soumis [1] quelque soit la valeur booléenne renvoyée par la fonction soumettre(). Pourquoi ? Si un formulaire ne contient pas de champ input submit, il est créé par défaut mais invisible. C'est pourquoi il convient d'utiliser l'événement onsubmit pour valider un formulaire.

Pages 1 | 2


[1] si on tape [entrée] dans un champ texte