Les zones de saisie
Grâce à la commande <input>, il est possible de créer des formulaires. Deux attributs sont toujours associés à ce marqueur :
qui sert d'étiquette aux informations qui vont être saisies ou sélectionnées (par exemple, une zone de saisie pourra être reliée à un champ d'une base de données). C'est le nom du champ.
permet de définir la nature du champ de saisie. Il est suivi d'une valeur et d'un certain nombre d'options pour donner une forme de saisie ou de sélection.
Cette valeur permet de recevoir du texte. Il est possible de définir le nombre de caractères grâce à l'attribut size :Le code suivant :
<form>
Nom : <input type="text" name="nom" size=30>
Prénom : <input type="text" name="prenom" size=15>
</form>donnera à l'écran
type=password
Similaire à la valeur précédente, excepté que les données saisies n'apparaissent pas "en clair" à l'écran. Il est possible de définir le nombre de caractéres grâce à l'attribut size :
Le code suivant :
<form>
Votre mot de passe : <input type="password" name="mot_de_passe" size=10>
</form>donnera à l'écran
type=checkbox
Fait apparaître une zone de sélection qui prend la forme d'une case cochable. La variable value permet d'attribuer une étiquette à la variable name la valeur de la case sélectionnée. L'option checked fait apparaître une case cochée par défaut :
Le code suivant :
<form>
<input type="checkbox" name="viennoiserie" value="croissant" checked>Croissant
<input type="checkbox" name="boisson" value="cafe">Café
<input type="checkbox" name="boisson" value="jus_de_fruit" checked>Jus de fruit
</form>donnera à l'écran
type=radio
Identique à l'option précédente. Seul point différent, une seule sélection pourra être validée (avec checkbox, on peut sélectionner plusieurs choix en même temps) :
Le code suivant :
<form>
<input type="radio" name="civil" value="Mr">Monsieur
<input type="radio" name="civil" value="Mme" checked>Madame
<input type="radio" name="civil" value="Mlle">Mademoiselle
</form>donnera à l'écran
type=range
range permet à l'utilisateur d'entrer un nombre dont les limites sont fixées par 2 variables : min et max.
Le code suivant :
<form>
Donnez maintenant une note entre 0 et 20 :</form>
<input type="range" name="note" min=0 max=20 size=2>donnera à l'écran :
type=submit
Submit est un des deux boutons se trouvant au bas de tout formulaire de saisie. Il permet d'envoyer les informations saisies vers le serveur (donc de valider la saisie). L'attribut value permet de spécifier les mots figurant sur le bouton :
Le code suivant :
<form>
<input type="submit" value="Valider la saisie">
</form>donnera à l'écran
type=reset
Idem au bouton précédent mais réinitialise tous les champs de saisie (annule la saisie) :
Le code suivant :
<form>
<input type="reset" value="Effacer et recommencer">
</form>donnera à l'écran
Les champs mémos
Pour
créer une zone de saisie comportant plusieurs lignes, on utilise les
marqueurs <textarea></textarea>.
Deux attributs
permettent de définir la taille de la zone de saisie en nombre de lignes
rows et en nombre de colonnes
cols.
Le code suivant :
<form>
Vos commentaires :
<textarea name="comments" rows=10 cols=20>
</textarea>
</form>donnera à l'écran
<select> </select> permettent de créer des menus déroulants comportant deux ou plusieurs options.
Le code suivant :Récupération et exploitation des données
<form>
<p>Sélectionnez un jour de la semaine :
<select name="jour_semaine">
<option>Lundi
<option>Mardi
<option>Mercredi
<option>Jeudi
<option>Vendredi
<option>Samedi
<option>Dimanche
</select>
</form>donnera à l'écran :
On peut aussi spécifier la taille de la fenêtre de sélection en ajoutant la variable size. Dans le cas où size=6, la fenêtre de sélection fera apparaître les six premières options du menu.
Lorsque l'on désire réaliser un menu à choix multiple, il suffit d'ajouter l'attribut multiple.
En rajoutant, l'option selected au marqueur <option>, l'information qui suit sera sélectionnée par défaut.
Les données
bien évidemment, à un moment ou à un autre devront être récupérées et
enregistrées par le serveur en vue de leur traitement. Les possibilités
qui sont offertes dans ce domaine sont très nombreuses. Elles n'entrent pas dans les spécifications du langage
HTML puisque ce dernier se borne uniquement à définir l'aspect
des pages Web. Un programme informatique traîtant les données transmises
par un formulaire doit être, à cet effet, mis en place sur le serveur qui
abrite ledit formulaire.