HTML — Listes de choix et zones de texte

select, textarea, datalist et output permettent de proposer des choix, de recueillir des textes longs, de suggérer des valeurs et d’afficher des résultats qu’un simple champ sur une ligne ne peut pas représenter correctement.

Certaines questions demandent une liste de choix, une réponse rédigée plus longue, des suggestions ou le résultat d’un calcul. select, textarea, datalist et output répondent à ces besoins. Les libellés visibles et les noms d’envoi vus dans la leçon sur les formulaires HTML restent nécessaires.

Créer un select avec un libellé et des choix explicites

select contient des éléments option. La donnée envoyée est le value de l’option sélectionnée, ou son texte si value est absent. optgroup donne un nom à un sous-ensemble d’options. multiple permet plusieurs sélections, ce qui modifie à la fois l’interface et les données envoyées. Une première option d’invite avec value="", associée à required sur select, peut obliger à faire un véritable choix.

<label for="experience">Votre expérience de HTML</label>
<select id="experience" name="experience" required>
  <option value="">Choisissez une option</option>
  <optgroup label="En cours d’apprentissage">
    <option value="new">Je découvre HTML</option>
    <option value="some">J’ai déjà écrit du HTML</option>
  </optgroup>
  <optgroup label="Accompagnement d’autres personnes">
    <option value="mentor">Je relis le HTML d’autres personnes</option>
  </optgroup>
</select>

• Associez un libellé visible à l’id du select.