Discussion :

[devdebutante]

Bonjour, j'ai créé une liste déroulante qui fonctionne très bien sous mozilla mais sous IE, la liste s'affiche sans les options.

voici le select:

Code :

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

<select id="r_niv0" onchange="droit(1);" style="display:inline;"></select>

La fonction droit permet d'afficher dans une autre liste déroulante des options suivant celle que l'on a choisi dans la première liste.

je pense que c'est au niveau du onchange que ça déconne car j'ai une autre liste sans onchange qui fonctionne très bien sous IE comme sous mozilla.

Quelqu'un aurait-il une idée pour résoudre mon pb?

[dream_of_australia]

C'est ta première liste qui s'affiche mal ou la liste liée ?

[blueice]

Ne penses-tu pas que ça puisse être un problème Javascript ?

[devdebutante]

A dream_of_australia:
En fait, j'ai 4 listes qui se suivent de cette manière: une option selectionnée dans la première appelle une liste d'options qui se met dans la deuxième, une option selectionnée dans la deuxième appelle une liste d'options qui se met dans let ainsi de suite.

[dream_of_australia]

J'ai bien compris que tu faisais des listes liées. Tu ne dis pas quelle liste ne s'affiche pas... La première ou une des suivantes ?

[devdebutante]

A dream_of_australia:
En fait, j'ai 4 listes qui se suivent de cette manière: une option selectionnée dans la première appelle une liste d'options qui se met dans la deuxième, une option selectionnée dans la deuxième appelle une liste d'options qui se met dans la troisième et ainsi de suite. Les 4 listes s'affichent mais elles sont vides.

A bluice:
C'est peut être un pb javascript mais dans ce cas, connaîtrais tu un endroit où je pourrais trouver les propriétées qui fonctionnent sous mozilla et pas sous IE et qui proposerais une solution?

[dream_of_australia]

Alors ça doit venir du code d'insertion de tes listes. Montre-le-nous, on pourra peut-être y voir plus clair. Normalement un

Code :

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

document.getElementById('liste1').innerHTML

fonctionne sous IE si tu mets un div 'liste1' (vide au départ, tu mets en suite toute ta liste : le select et les options) : <div id='liste1'></div>, je viens de regarder dans mes codes.
IE a du mal avec les <select>...

[devdebutante]

En fait, je récupère les valeurs des options dans un document XML, voici le code:

les 2 premières fonctions: sup et options sont utilisées dans la fonction droit

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
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
function sup(c){			
	var $n = c.childNodes.length;
	for (var i=0 ; i<$n ; i++)
    c.removeChild(c.firstChild);
}
 
function options(a,b){		            
	var $n = a.childNodes.length;
	for (var i=0 ; i<$n ; i++){
    var $el = a.childNodes[i];
		var $opt = document.createElement("option");																													
    var $nS = $el.nodeName;																																
    $opt.value = $nS.substring(2,$nS.length + 1);																													
    topt = document.createTextNode($el.getAttribute("id"));																					
    $opt.appendChild(topt);
    b.appendChild($opt);
  }
}
 
 
function droit(indiceNiveau){	
 
	var niveau = new Array(nivMax-1);
 
	var $dr = Docxml.getElementsByTagName("droit2")[0];// noeud "droit" du xml
 
	// Tableau pointant sur les objects html select qui pour id : niv0, ..., niv{nivMax}
	niv = new Array(nivMax);
 
	for(var t=0 ; t<nivMax ; t++)
		niv[t] = document.getElementById(prefixeNiveau + "niv" + t);
 
	// Traiter successivement les object html select à partir du select associé à indiceNiveau du tableau niv
	for(var t=indiceNiveau ; t<nivMax ; t++){
 
		// Vider l'objet html select courant
                sup(niv[t]);
                
                if (t==0){
                
                        // Niveau 1: la liste ne dépend pas d'une valeur, récupérer les niveaux 1 directement sour le noeud droit2
			options($dr,niv[0]);
 
		}else{
 
			// Niveau > 1 : Récupérer l'id du niveau supérieur sélectionné
            nivselect = niv[t-1].childNodes[niv[t-1].selectedIndex].value;
 
            // Récupérer les niveau t directement sous le noeud de niveau supérieur
            var $apro = $dr.getElementsByTagName('n'+t+nivselect)[0];
 
			options($apro,niv[t]);
		}
	}
}

[dream_of_australia]

Ca vient de ton var $opt = document.createElement("option"); et appendChild qui ne marchent pas sous IE.

Un code qui fonctionne sur un de mes sites :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
liste = document.createElement("select") ;
var k ;
for (i = 0 ; i < tab.length ; i++) {
     if (navigator.appName == "Microsoft Internet Explorer") {
	k = new Option(tab[i][1],tab[i][0]);
	liste.add(k);
    }
    else {
	k = document.createElement("option");
	k.value = tab[i][0] ;
	k.text = tab[i][1] ;
	liste.appendChild(k) ;
}

à adapter

[devdebutante]

Merci, je ne peux pas essayer tout de suite mais je te préviens dès que c'est fait.

[Auteur]

bonjour,

voici un exemple sur la manière de créer et d'insérer des options dans une liste déroulante.

[dream_of_australia]

Je ne crois pas que la fonction new Option fonctionne sous Firefox. J'avais eu le problème, c'est pour ça que j'ai fait une insertion de liste en fonction du navigateur. Mais les tutos sont toujours bons à lire ! Les rédacteurs font vraiment du bon boulot.