|
<?xml version="1.0" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Exemple de formulaire</title> </head> <body> <form action=""> <table> <tr> <td>Nom:</td><td><input type="text" name="nom" maxlength="64" /></td> <td>Prénom:</td><td><input type="text" name="prenom" maxlength="64" /></td> </tr> <tr> <td>Sexe:</td> <td> <input type="radio" name="sexe" value="H" />Homme<br /> <input type="radio" name="sexe" value="F" />Femme </td> <td>Date de naissance:</td> <td><input type="text" name="naissance" maxlength="10" size="10"/></td> </tr> <tr> <td valign="top" colspan="2">Connaissances informatiques:</td> <td><input type="checkbox" name="ci_html"/>HTML<br /> <input type="checkbox" name="ci_css"/>CSS<br /> <input type="checkbox" name="ci_js"/>Javascript </td><td> <input type="checkbox" name="ci_php"/>PHP<br /> <input type="checkbox" name="ci_jee"/>JEE<br /> <input type="checkbox" name="ci_dotnet"/>.Net </td> </tr> <tr> <td colspan="2">Niveau:</td> <td> <select name="niveau"> <option value="0">Débutant</option> <option value="1">Amateur</option> <option value="2">Confirmé</option> <option value="3">Expert</option> </select> </td> </tr> <tr> <td colspan="2">L'informatique vous occupe:</td> <td> <input type="text" name="occupation" size="3" maxlength="3" /> % de votre temps </td> </tr> </table> <input type="submit" value="Sauver"/> </form> </body> </html> |
4.Formulaire
4.7.Pour allez plus loin
Nous avons vu l'ensemble (j'ai bien dit) l'ensemble des types de champs de formulaires proposés par le langage HTML. Vous êtes maintenant capable de réaliser des formulaires comme le suivant:
vous pouvez le visualiser ici Démonstration de formulaire HTML (avec une présentation volontairement sommaire).
html/formulaire_demo.htmlJe sais ce que vous vous dites... Bof... pas terrible. Pour le champ date j'aurais aimé avoir un calendrier. Pour le champ "pourcentage de temps passé je peux saisir autre chose que des chiffres, ça craint. Les champs obligatoires laissés vide ne sont même pas mis en évidence. Et puis, quand j'ai une liste de sélection, j'aime bien pouvoir saisir les premières lettres et avoir une complétion automatique. Etc.... Ok... Ok... n'en jetez plus.
En fait, tout ce qui vient d'être évoqué sont des fonctionnalités qui ne sont pas offertes par le langage HTML. "Oh l'aut' il est naze... si je l'ai vu sur d'autres sites, c'est que c'est faisable." En effet, c'est faisable mais pour cela il faut recourir à une technologie complémentaire. Le Javascript
[c'est quoi?]
(couplé au CSS) est une des solutions, comme nous l'expliquons dans le chapitre Formulaire avancé avec javascript.
