Les formulaires (partie 1) Comment récupérer la valeur d'un select ?

Bonjour,

j'attaque la relecture de la section formulaires de la FAQ. Et pour commencer :


Comment récupérer la valeur d'un select ?
:arrow: http://javascript.developpez.com/faq...amps#valSelect


Pas grand chose à dire... les modifications ne concernent que la forme :
- suppression du symbole "-->"
- ajout d'une précision dans la question : c'est la valeur d'une option d'un select pas la valeur du select
- petites corrections du code : remplacement des guillemets simples par des guillemets doubles dans getElementById()
- ajout du paragraphe attention et ajout d'un lien vers une autre question de la FAQ (pas présent dans ma correction).

Citation:

---

Comment récupérer la valeur d'une option d'un select ?

Ce code est utile pour, par exemple, récupérer la valeur de l'option choisie par l'internaute d'une liste déroulante select.

Code:

---

1 2	var valeur; valeur = document.getElementById("liste").options[document.getElementById('liste').selectedIndex].value;

---

Pour éviter la répétition du document.getElementById("liste"), on peut écrire :

Code:

---

1 2 3

var liste, valeur; liste = document.getElementById("liste"); valeur = liste.options[liste.selectedIndex].value;

---

Explications :
document.getElementById("liste") : permet de désigner la liste en question.
La propriété options permet de désigner une des valeurs de la liste déroulante. Il s'agit d'un tableau (et possède donc toutes les propriétés d'un tableau javascript).

Ainsi, pour désigner le premier élément de la liste, il suffit de faire :

Code:

---

document.getElementById("liste").options[0];

---

Pour connaître le nombre d'éléments d'une liste :

Code:

---

document.getElementById("liste").options.length;

---

Attention :

• ce code est valable uniquement si l'attribut multiple de la balise select est absent. Pour récupérer les valeurs des options sélectionnées voir :
  [url]Comment récupérer les valeurs d'un select multiple ?[/url].
• il faut préciser l'attribut value dans les balises options.

---

Bah si pourtant... beaucoup de choses à dire ! :aie:

La méthode présentée est complètement obsolète (depuis au moins IE6).
Cela fait longtemps qu'un simple

Code:

---

valeur = document.getElementById("liste").value;

---

est amplement suffisant quel que soit le navigateur. ;)

Tu m'apprends quelque chose :aie: Du coup, cela va simplifier grandement la Q/R.

J'attends d'autres commentaires et je mettrai à jour mon antique (:aie:) code.

:ccool:

Bon finalement je corrige maintenant. Cela simplifie sérieusement le code.


Proposition de correction :

Citation:

---

Comment récupérer la valeur d'une option d'un select ?

Ce code est utile pour, par exemple, récupérer la valeur de l'option choisie par l'internaute d'une liste déroulante select.

Code:

---

1 2	var valeur; valeur = document.getElementById("liste").value;

---

Attention :

• ce code est valable uniquement si l'attribut multiple de la balise select est absent. Pour récupérer les valeurs des options sélectionnées voir :
  [url]Comment récupérer les valeurs d'un select multiple ?[/url].
• il faut préciser l'attribut value dans les balises options.

---

Pas de remarque.

Ok, donc discussion :resolu: pour indiquer que l'on peut la mettre à jour.
:merci: pour ta relecture.