5568 sujets

Sémantique web et HTML

Bonjour à tous,

je me pose une question :

"Comment peut-on faire pour avoir dans un formulaire une (ou plusieurs) balises select (contenant donc une liste de valeurs) dans laquelle on pourrait rajouter une valeur si cette dernière n'existe pas dans la liste."

Même en me relisant, j'ai presque du mal à me comprendre...

Le but serait de remplir cette liste au fur et à mesure des besoins.
J'ai la valeur dans la liste -> je la sélectionne
Je n'ai pas la valeur dans la liste -> je la crée pour que la prochaine fois, elle existe dans la liste.

J'ai cherché via google, mais je n'ai rien trouvé.
Bonjour,

Une liste de sélection avec:
- Valeur 1
- Valeur 2
- Valeur 3
- Nouvelle valeur...

Ensuite, un champ texte pour que l'utilisateur puisse saisir la nouvelle valeur. Dans certains cas, on cache le champ texte (et son label explicite) en JavaScript au chargement de la page, puis on affiche ce champ si l'utilisateur choisit la valeur «Nouvelle valeur...» dans la liste de sélection qui le précède.

Le problème avec cette solution, c'est que le lien entre le choix dans la liste de sélection n'est pas codé correctement dans le code HTML. Ça peut se contourner en choisissant des intitulés bien clairs, notamment pour le label du champ texte.

Une autre solution, c'est de présenter ça comme une série de boutons radio:
<fieldset>
  <legend>Choisissez une valeur</legend>
  <input id="f1" type="radio" value="1" />
  <label for="f1">Valeur 1</label>
  <br />
  <input id="f2" type="radio" value="2" />
  <label for="f2">Valeur 2</label>
  <br />
  <input id="f3" type="radio" value="3" />
  <label for="f3">Valeur 3</label>
  <br />
  <input id="f4" type="radio" value="4" />
  <label for="f4">
    Nouvelle valeur:
    <input type="text" />
  </label>
</fieldset>

Enfin, une solution peut-être plus intéressante est d'avoir une phrase du type «Entrez une nouvelle valeur [.........] ou bien choisissez une valeur existante [...|valeur1|valeur2|valeur3]», avec un champ texte dans le premier cas, et un select ensuite. Cela peut tenir sur une ligne, ou être réparti en deux temps sur deux lignes.