Liste select sans selection

**younesssoleil** · 22/06/2017, 12h53

Bonjour,
Au chargement de ma page, je charge 'en lisant depuis une base de données' des éléments dans une liste Select " listeusers"

donc ma liste listeusers contient bien mes éléments: test1, test2, test3...
mon problème: je n'arrive pas à lire l’élément affiché en premier 'ici test1' sans appliquer la fonction :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

listeusers.options[listeusers.selectedIndex].value

car mon but est de retourner l’élément afficher en premier sans sélectionner dans la liste.
est ce possible?Merci

**ProgElecT** · 22/06/2017, 13h39

Salut

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var premelem = document.getElementById("listeusers")[0].value;

**younesssoleil** · 22/06/2017, 13h51

Merci..J'ai l'erreur suivante:

TypeError: Cannot read property 'value' of undefined

**ProgElecT** · 22/06/2017, 14h02

Re
?
peut être:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var premelem = document.getElementById("listeusers")[0].text;

ou encore:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

var premelem = document.getElementById("listeusers").option[0].text;

**younesssoleil** · 22/06/2017, 14h11

Toujours la même erreur..j'ai l'impression que pour le programme la liste est vide tant que je n'ai pas sélectionné un élément ...je galère..

**ProgElecT** · 22/06/2017, 14h57

C'est peut être l'endroit ou est placée ta commande script dans l'ensemble de ton code.
Ta liste n'est peut être pas remplie quand tu tentes de récupérer ton premier élément de ta liste.
car

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<!DOCTYPE html>
<html>
<body>
 
<select id="mySelect">
  <option>Premier</option>
  <option>Deuziéme</option>
  <option>Troisiéme</option>
  <option>Quatriéme</option>
</select>
<select id="num" onchange="affiche()">
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
</select>
<p id="result"></p>
<script>
function affiche(){
var nindex = document.getElementById("num").selectedIndex;
    var premelem = document.getElementById("mySelect").options[nindex].text;
    document.getElementById("result").innerHTML = premelem;
    }
</script>
 
</body>
</html>

donne le bon résultat.

**younesssoleil** · 23/06/2017, 01h12

Un bon exemple..en fait je souhaite qu'au chargement de la page result soit égale à "Premier" ( car la valeur affichée dans la select "num" est 1)
avant de sélectionner une valeur
Merci

**ProgElecT** · 23/06/2017, 09h37

Salut

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
<!DOCTYPE html>
<html>
<script>
        window.onload = chargeoptionslist; //exécuté une fois, la page finit de chargez
//*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*
function chargeoptionslist(){
        alert('coucou 2, je vais charger la liste');
        // 1er temps, je charge en lisant depuis une base de données des éléments dans une liste Select "listeusers"
    
    // ici le code ............
    
        // puis 2éme temps, une fois "listeusers" chargée
        var premelem = document.getElementById("listeusers").options[0].text;
        alert("coucou 3, j'ai récupéré le premier élément de la liste, \n il s'agit de: " + premelem);
}
//*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*--*
</script>
 
<body>
 
	<select id="listeusers">
  		<option>Premier</option>
  		<option>Deuxième</option>
  		<option>Troisième</option>
  		<option>Quatrième</option>
	</select>
 
<script>alert('coucou 1, mon code HTML est chargé');</script>
 
</body>
</html>

3 boites alert sont enclenchées, cela te donne une idée du déroulement du code.

**younesssoleil** · 23/06/2017, 10h18

Je ne comprends plus...tj le même problème:

voici mon code:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
window.onload= chargeoptionslist;
 
function chargeoptionslist(){
  ajoutalluser(); // fonction qui charge l'ensemble des users ( PI: j'utilise firebase)
 
        var premelem = document.getElementById("listeusers").options[0].text;
         //console.log(premelem);
}

/////fonction ajoutalluser/////

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
function ajoutalluser(){  // fonction qui charge tous les users dans le liste de choix :listeusers
 var user = firebase.auth().currentUser;
 
listeusers.length=0;
var query = firebase.database().ref().child('Admin/' + user.uid).child("Pseudo").orderByKey();  
query.once("value")
.then(function(snapshot) {
snapshot.forEach(function(childSnapshot) {
 
var key = childSnapshot.key;
 
//...Création d'une nouvelle option
nouveauuser = new Option(childSnapshot.key);
//...et insertion ds la liste déroulante 
listeusers.options[listeusers.length] = nouveauuser;
 
});
});
}

**younesssoleil** · 23/06/2017, 20h53

Bonsoir..merci j'ai trouvé
en faite je récupère la valeur du 1 er élément de la liste juste avant la fin de la fonction "ajoutalluser"
Merci bcp ...

Liste select sans selection

JavaScript

Discussions similaires

Partager

Partager