corrigé HTML 4 – les formulaires HTML

Voici le code nécessaire au 1er formulaire form1.htm:

<html>
<head></head>
<body>
<hr />Veuillez remplir ce Formulaire...
<form method="post" action="fiche.htm">
<table border="0" width="75%">
<tr>
<td >Civilité</td>
<td >
<input type="radio" name="civilite" value="Monsieur" checked="checked"/>
Mr
<input type="radio" name="civilite" value="Madame" />
Mme
<input type="radio" name="civilite" value="Mademoiselle" />
Melle</td>
</tr>
<tr>
<td >Nom</td>
<td ><input name="nom" maxlength="40" size="40" type="text" /></td>
</tr>
<tr>
<td >Prénom</td>
<td ><input name="prenom" maxlength="30" size="30" type="text" /></td>
</tr>
<tr>
<td height="40" >Mois de naissance</td>
<td height="40" >
<select name="mois" size="1">
<option value="1" selected="selected">Janvier</option>
<option value="2">Février</option>
<option value="3">Mars</option>
<option value="4">Avril</option>
<option value="5">Mai</option>
<option value="6">Juin</option>
<option value="7">Juillet</option>
<option value="8">Aout</option>
<option value="9">Septembre</option>
<option value="10">Octobre</option>
<option value="11">Novembre</option>
<option value="12">Décembre</option>
</select></td>
</tr>
<tr>
<td >Permis B</td>
<td ><input name="permis" value="permis_ok" type="checkbox" /></td>
</tr>
<tr>
<td width="350">No telephone</td>
<td width="450">
<input type="text" name="telephone">
</td>
</tr>
<tr>
<td height="25">Code CB</td>
<td ><input name="cb" maxlength="16" size="16" type="password" /></td>
</tr>
<tr>
<td >Commentaire</td>
<td ><textarea name="commentaire" cols="40" rows="5"></textarea></td>
</tr>
</table>
<p>
<input type="submit" name="Submit" value="Envoyer Formulaire">
<input type="reset" name="Submit2" value="Effacer formulaire">
</p>
</form>
</body>
</html>

Avec la méthode ‘POST’ les paramètres saisies dans le formulaire n’apparaissent pas dans la barre d’adresse du navigateur.
Avec la méthode ‘GET’ ils appraissent sous forme de liste encodée pour masquer les caractères spéciaux. La liste de pramètres commence par un ‘?’.
Chaque paramètre est introduit par le caractère ‘&’. Ensuite vient le nom du paramètre (qui correspond � l’attribut ‘NAME’ de l’objet du formulaire correspondant), le signe ‘=’ et la valeur du paramètre saisie par l’utilisateur (qui correspond en général � l’attribut ‘VALUE’ de l’objet).

Voici un exemple de liste de paramètres envoyé par ce formuliare avec la méthode GET :

...fiche.htm?Civilite=Monsieur&civilite=Madame&nom=Del%E9glise
&prenom=Didier1mois=7&permis=checkbox&textfield=0491919191
&cb=12345678901commentaire=mon+premier+client
&envoi=Envoyer+le+formulaire

On vérifie ici que les caractères accentués sont remplacés par l’entité HTML correspondante, ainsi ‘Deléglise’ est codé ‘ Del%E9glise’ , le code E9 correspondant au caractère ‘é’. Les espaces ‘ ‘ sont remplacés par des ‘+’

On note également que le code de CB maqué � la saisie par l’attribut ‘TYPE= »PASSWORD » … apparaît ici en clair !!

Et enfin on remarque que le formulaire contenait 8 champs personnalisable et 2 boutons, et que la liste comprend tous les champs personnalisables ET le bouton ‘Envoi’…avec sa valeur , c’est � dire le texte affiché sur le bouton…