Changer selected option en fonction d'un attribut

Bonjour à tous
Je viens demander de l'aide.

J'ai des select générés dynamiquement et contenant un attribut "data-val". Ce que j'aimerai faire c'est que pour chaque select, l'option sélectionnée soit celle qui a la même value que l'attribut "data-val".
Les select ont la même classe et le même name, j'ai essayé avec un queryselectorall afin de boucler sur les select et effectuer l'opération mais sans résultat et la je me tourne vers vous.

Ci dessous un mon code :

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13

<select name="nselect" class="cselect" data-val="1"> <option value="" selected>Choose</option> <option value="1">one</option> <option value="2">two</option> <option value="3">three</option> </select>   <select name="nselect" class="cselect" data-val="3"> <option value="" selected>Choose</option> <option value="1">one</option> <option value="2">two</option> <option value="3">three</option> </select>

---

Code:

---

1 2 3 4 5

const elements = document.querySelectorAll(".cselect"); elements.forEach(function (element) { var item = element.getAttribut('data_val'); //la j'aimerai que l'option selectionnée soit celle avec value = item });

---

Merci d'avance pour votre aide.

Cordialement

Bonjour,

Code:

---

1 2 3 4 5 6 7

const selects = document.querySelectorAll(".cselect"); selects.forEach(function (select) { if( select.dataset.val ) { select.selectedIndex = select.dataset.val; // option selectionnée } });

---

Bonjour
Ça marche! Merci à toi

Bonjour,

Citation:

---

Code:

---

select.selectedIndex = select.dataset.val; // option selectionnée

---

---

Attention ne fonctionne que si la valeur vaut l'index !

Il est souvent préférable d'affecter directement la valeur au <select> et si celle-ci n'existe pas rien ne sera sélectionné.

Code:

---

1 2 3 4 5 6 7 8 9

const selects = document.querySelectorAll(".cselect"); selects.forEach(function(select) { if (select.dataset.val) { //select.selectedIndex = select.dataset.val; // option selectionnée   // affectation directe de la valeur select.value = select.dataset.val; } });

---

C'est très juste.

Je ne sais même pas pourquoi j'ai utilisé .selectedIndex au lieu de .value.
(il faut dire que je code plus souvent en jQuery qu'en JS pur)