| | auteur : MasterOfChakhaL |
Pour réunir certains champs de formulaires, vous pouvez les inclure dans
un élément fieldset.
Si de plus vous voulez indiquer un titre pour ce bloc, vous devez utiliser
l'élément legend.
| Code XHTML : |
<form action="ma-page.php" method="post">
<fieldset>
<legend>Civilité</legend>
<label>Nom :</label><input type="text" name="nom" />
<label>Prénom :</label></input type="text" name="prenom" />
</fieldset>
<fieldset>
<legend>Contact</legend>
<label>Adresse :</label><textarea name="adresse"></textarea>
<label>Téléphone :</label><input type="text" name="telephone"/>
</fieldset>
</form>
|
Avec le code précédent, vous aurez quatre champs de saisie réparties dans deux
cadres distincts. De plus ces cadres auront un titre (généralement placé
à cheval sur la bordure du haut).
Ceci peut vous permettre de mieux structurer vos formulaires, ce qui peut
être un plus appréciable pour l'utilisateur quand vous proposez des formulaires
complexes.
 |
Attention : Si vous décidez de définir un titre à l'aide de l'élément
legend, alors cet élément doit obligatoirement être le premier fils
de l'élément fieldset.
|
|
| | auteur : Yoshio |
Pour définir un libellé dans un formulaire, le (X)HTML dispose de l'élément
label.
De plus, si vous reliez l'élément label au champ de formulaire, alors un
clique sur le libellé donnera le focus au champ.
Pour associer votre libellé au champ de formulaire, il y a deux possibilités :
- Soit vous incluez directement le champ dans votre libellé ;
- Soit vous renseignez l'attibut for de l'élément label
avec l'id du champ correspondant.
| Code XHTML : |
<label>Nom :<input type="text" name="nom" /></label>
<label for="id-nom">Nom</label>
<input type="text" name="nom" id="id-nom" />
|
 |
Si vous associez votre libellé à une case à cocher ou à un bouton radio,
alors cliquer sur le libellé aura pour effet de selectionner la case ou le bouton.
|
|
Utilisez cet élément vous permet de rendre votre formulaire plus accessible.
Ainsi, si un utilisateur consulte votre site grâce à un lecteur d'écran, ce dernier
sera en mesure d'indiquer que tel libellé correspond à tel champ, même si pour une raison
ou une autre ces deux informations sont éloignées dans votre code source.
|
|
| | auteur : Yoshio |
Si vous avez besoin de réunir certaines options d'une liste déroulante, vous pouvez
utiliser l'élément optgroup.
Utiliser cet élément vous autorise à regrouper les options en suivant une
certaine logique, ce qui est particulièrement appréciable lorsque vous
présentez une liste avec un nombre important d'options.
Vous pouvez donner un nom à ce groupe en définissant l'attribut label.
| Code XHTML : |
<label for="form_country">Pays : </label>
<select id="form_country" name="country">
<optgroup label="Amérique">
<option value="ca">Canada</option>
<option value="us">États-Unis</option>
</optgroup>
<optgroup label="Europe">
<option value="be">Belgique</option>
<option value="fr">France</option>
</optgroup>
</select>
|
|
Attention : Les noms de groupes qui apparaissent dans la liste
ne sont pas selectionnables et ne peuvent pas être transmis lorsque le
formulaire est soumis.
|
|
| | auteur : Maxoo |
Il y a deux manières de le faire :
-
disabled : le champ input sera grisé dans le navigateur,
et n'est pas transmis lors de la soumission du
formulaire.
<input type="text" name="toto1" value="toto1" disabled="disabled" />
|
-
readonly : le champ paraîtra comme champ normal, mais
la valeur ne sera pas modifiable, et sera transmis lors
de la soumission du formulaire.
<input type="text" name="toto2" value="toto2" readonly="readonly" />
|
|
| | auteur : Jérôme |
Il faut rajouter dans la balise la propriété checked.
Par exemple :
<form>
<input type="radio" name="a" checked>
<input type="radio" name="b">
</form>
|
Avec ce code, le bouton a sera coché par défaut au
chargement de la page.
Note : En XHTML, il faut utiliser checked="checked"
|
| | auteur : Giminik |
Il faut utiliser l'attribut selected dans la balise
<option> que l'on souhaite sélectionner.
<select name="monselect">
<option value="1">un</option>
<option value="2">deux</option>
<option value="3" selected="selected">trois</option>
<option value="4">quatre</option>
</select>
|
|
| | auteur : Linaa |
Il faut ajouter l'attribut disabled au bouton radio ou à la case à cocher.
Exemple :
| Pour un bouton radio |
<input name="mon_bouton_radio" type="radio" disabled="disabled" />
|
| Pour une case à cocher |
<input name="ma_checkbox" type="checkbox" disabled="disabled" />
|
|
Consultez les autres F.A.Q's
 
|
|
Les sources présentées sur cette page sont libres de droits
et vous pouvez les utiliser à votre convenance. Par contre, la page de présentation
constitue une œuvre intellectuelle protégée par les droits d'auteur.
Copyright © 2004 Developpez.com Developpez LLC.
Tous droits réservés Developpez LLC. Aucune reproduction, même partielle, ne
peut être faite de ce site ni de l'ensemble de son contenu : textes, documents
et images sans l'autorisation expresse de Developpez LLC. Sinon vous encourez
selon la loi jusqu'à trois ans de prison et jusqu'à 300 000 € de dommages et intérêts.
