<input type="text">: zone de saisie de texte sur une seule ligne

Une zone de saisie de texte se définit à l'aide d'un élément <input type="text"> ou plus simplement <input> ("text" est la valeur par défaut).

<input type="text">
   <nom>nom</nom>
   <libellé>entrez vos nom et prénom</libellé>
</input>

Contenu de l'élément <input type="text">

L'élément <input type="text"> (ou <input>) peut posséder les sous-éléments suivants (ils ne sont pas obligatoires):

Ces sous-éléments peuvent être complétés par tous les éléments communs aux blocs, une question dans un formulaire étant considérée comme un bloc. Ceux-ci permettent de mettre en page la zone de saisie de texte.

L'élément <input type="text"> peut posséder les attributs suivants (ils ne sont pas obligatoires):

Ces attributs peuvent être complétés par tous les attributs communs aux blocs, une question dans un formulaire étant considérée comme un bloc. Ceux-ci permettent de mettre en page la zone de saisie de texte.

Il est également possible d'utiliser les synonymes suivants:

Valeur par défaut à afficher dans la zone

La valeur par défaut qui s'affichera lorsque la page est chargée dans le navigateur se définit à l'aide d'un élément <valeur> (ou <value>). Si celui-ci n'est pas présent, la zone sera vide.

Modification de l'apparence de la zone de saisie de texte

Style de la zone de saisie de texte

Une zone de saisie est considérée comme un bloc. Tous les attributs (style, bords et ses variantes) définis pour les blocs peuvent être utilisés (l'élément <titre>, ici, n'a pas lieu d'être).

Si vous n'utilisez pas d'attribut style, la zone sera affiché sans mise en page particulière (identique à style="transparent"). Dans le cas contraire c'est un bloc dont la mise en page est définie par cet attribut style qui sera affiché.

Taille de la zone de saisie de texte

La taille de la zone est paramétrable à l'aide d'un élément <taille> (ou <size>) qui donne le nombre maximal de caractères qui seront visibles (sans utiliser le curseur) dans la zone (ce nombre est parfois approximatif).

<input type="text">
   <nom>nom</nom>
   <libellé>matricule</libellé>
   <taille>6</taille>
</input>

<input type="text">
   <nom>nom</nom>
   <libellé>nom et prénom</libellé>
   <taille>20</taille>
</input>

<input type="text">
   <nom>nom</nom>
   <libellé>email</libellé>
   <taille>64</taille>
</input>

Contrôle de la valeur entrée dans la zone de saisie de texte

Limitation du nombre de caractères à saisir

Le nombre maximal de caractères accepté dans cette zone est paramétrable grâce à un élément <maxlen>.

<input type="text">
   <nom>matricule</nom>
   <libellé>Entrez votre matricule (9 caractères)</libellé>
   <maxlen>9</maxlen>
</input>

Rendre la zone obligatoire

Un élément <obligatoire/> (ou <mandatory/> qui est un synonyme) permet de rendre la zone de saisie de texte obligatoire (au moins un caractère doit avoit été entré dans la zone avant de pouvoir soumettre le formulaire).

<input type="text">
   <nom>matricule</nom>
   <libellé>Entrez votre matricule (9 caractères)</libellé>
   <obligatoire/>
</input>

Forcer en majuscules

Un élément <majuscule/> (ou <uppercase/> qui est un synonyme) permet de forcer la valeur en majuscules au moment de l'envoi.

<input type="text">
   <nom>nom</nom>
   <libellé>Entrez votre nom</libellé>
   <valeur>dupont</valeur>
   <majuscule/>
</input>

Forcer en minuscules

Un élément <minuscule/> (ou <lowercase/> qui est un synonyme) permet de forcer la valeur en minuscules au moment de l'envoi.

<input type="text">
   <nom>nom</nom>
   <libellé>Entrez votre nom</libellé>
   <valeur>dupont</valeur>
   <minuscule/>
</input>

Forcer en minuscules sauf la première lettre

Un élément <Minuscule/> (ou <Lowercase/> qui est un synonyme) permet de forcer la valeur en minuscules, excepté la première lettre qui sera en majuscule, au moment de l'envoi.

<input type="text">
   <nom>nom</nom>
   <libellé>Entrez votre nom</libellé>
   <valeur>dupont</valeur>
   <Minuscule/>
</input>

Supprimer les espaces

Un élément <trim/> permet de supprimer, au moment de l'envoi, les espaces et les tabulations au début et à la fin de la valeur entrée dans la zone de texte.

<input type="text">
   <nom>nom</nom>
   <libellé>Entrez votre nom</libellé>
   <valeur>   dupont   </valeur>
   <trim/>				
</input>

Un élément <normalisation/> (ou <normalize/>) agit comme un <trim/>, mais il remplace également toute suite d'espaces, de tabulations et de retours à la ligne par une seule espace.

<input type="text">
   <nom>nom</nom>
   <libellé>Entrez votre nom</libellé>
   <valeur>   du   	 pont   </valeur>
   <normalisation/>				
</input>

Imposer un format à la valeur entrée dans la zone

Un élément <format/> permet d'imposer un format aux données entrée dans la zone de texte. Plusieurs types de format sont possibles, sélectionnables à l'aide d'un attribut type. Cet attribut peut valoir:

• type="entier": impose le format d'un nombre entier (positif ou négatif);

• type="integer": synonyme de "entier";

• type="décimal": impose le format d'un nombre décimale (positif ou négatif avec, éventuellement, une partie décimale derrière la virgule. Celle-ci, comme souvent en informatique, s'écrit avec un '.');

• type="decimal": synonyme de "décimal";

Dans les quatres cas, un attribut minimum et un attribut maximum peuvent imposer une valeur minimale et une valeur maximale (ces deux valeurs étant comprises).

<input type="text">
   <nom>quantity</nom>
   <libellé>Entrez votre nom</libellé>
   <valeur>365</valeur>
   <trim/>
   <format type="integer"/>				
</input>

Dans cet exemple, on accepte un entier non négatif (valeur minimale égale à 0):

<input type="text">
   <nom>age</nom>
   <libellé>Donnez votre age</libellé>
   <trim/>
   <format type="integer" minimum="0"/>				
</input>

Dans cet autre exemple, on accepte une valeur décimale comprise entre -100 et +100

<input type="text">
   <nom>temp</nom>
   <libellé>Température</libellé>
   <valeur>38.5</valeur>
   <trim/>
   <format type="décimal" minimum="-100" maximum="+100"/>				
</input>