Liste déroulante IE6/IE7

**samuel4256** · 28/07/2010, 14h20

Bonjour, voilà une fonction Javascript qui gère ce qui doit se passer une fois un choix effectué dans une liste déroulante. Elle fonctionne très bien sous FireFox et IE8 mais pas sur les versions plus anciennes.
Comment la rendre compatible IE7 et IE6 ?

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
 
function envoiRequete3(iLigne)
{
	var ffformation = document.getElementById('ffformation'+iLigne).value;
	/*alert(ffformation);*/
 
    for (i=1 ; i<=200 ; i++)
        {
			if (document.getElementById('ffformation'+iLigne).selected)
                {
                    requeteAjax.open("GET", "/modules/testmodule/classes/FormationStagiaire.php?ffformation="+ffformation, true) ;
                    requeteAjax.onreadystatechange = function()
					{
						if (requeteAjax.readyState == 4)
						{
							document.getElementById("reponseParcours").innerHTML = requeteAjax.responseText ;
						}
					}
 
                    requeteAjax.send(null) ;
                }
        }
}

**SpaceFrog** · 28/07/2010, 14h32

une fois le choix effectué = quel evènement ?

**samuel4256** · 28/07/2010, 14h45

Voila la liste déroulante avec l'évènement onChange qui appelle la fonction

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
echo'
		<p id="titreStagiaire">Votre parcours</p><br><br>
		<div>
		<form name="formulaireFormation">
		Quelle formation voulez-vous ?<br><br>' ;
		/**********************************Liste déroulante des formations*****************************************/
		echo'
			<select name = "formation" size = "1"  onChange="envoiRequete3(this.selectedIndex)">' ;  
			foreach($bdd->afficherNomSFormationS() as $key=>$formation){
				echo'<option id="ffformation'.$i.'" align="center">'.$formation.'</option>' ;
				$i++ ;  
				}
			echo'
			</select>
		</form>' ;
		/**********************************************************************************************************/												
			echo'
			</div><br><br>
		<div id="reponseParcours"></div>
	</body>
</html>' ;

**SpaceFrog** · 28/07/2010, 15h00

z'ont pas de value tes options ?

**samuel4256** · 28/07/2010, 15h42

Non, l'id est suffisant, en tout cas pour FF et IE 8

id="ffformation'.$i.'"

**E.Bzz** · 28/07/2010, 15h59

Bonjour,
pour éviter de fâcher IE, il y a 2 règles à respecter concernant les identifiants JavaScript :

un nom de variable ne doit pas correspondre à un name ou un id de la page
un name ne doit pas correspondre à l'id d'un autre élément de la page

Pour autant, ça ne semble pas être le problème (à moins que ton script génère une option ayant un id="ffformation" ce qui correspondrait au nom de ta variable).

Par contre, es-tu bien sûr de nous montrer le bon script (celui qui fonctionne sous FF) ?
Parce que là, il semble y avoir un chtit problème de boucle :

Code :

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

for (i=1 ; i<=200 ; i++)

Tu n'utilises jamais ta variable i, mais uniquement iLigne.
Conséquence : tu lances 200 X la même requête Ajax.

Est-ce vraiment nécessaire ?

Tu ne le vois pas forcément à l'écran, puisque le contenu de ton div reponseParcours est remplacé à chaque fois par un contenu identique.

Je doute que le même code ait un effet très différent sous FF

EDIT : Question bonus : Pourquoi une boucle, d'ailleurs ?

Ta fonction semble être prévue pour traiter uniquement l'option sélectionnée.

A+

**SpaceFrog** · 28/07/2010, 15h59

comment recupères tu la selection sans value ???
tu passe par le innerHTML de l'option ?

de plus un id sur une option n'est pas crossbrowser je pense ..

**samuel4256** · 28/07/2010, 16h07

pour récupérer la sélection, je fais dans ma fonction Javacript:

Code :

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

document.getElementById('ffformation'+iLigne).value;

ce qui récupère la valeur de l'id ffformation+iLigne, iLigne dans ma fonction Javascript correspondant au $i en php qui est incrémenté dans la boucle donc chaque option a un id différent,
option 1 -> id='ffformation1'
option2 -> id='ffformation2' etc

**E.Bzz** · 28/07/2010, 16h17

Envoyé par samuel4256

iLigne dans ma fonction Javascript correspondant au $i en php qui est incrémenté dans la boucle donc chaque option a un id différent,
option 1 -> id='ffformation1'
option2 -> id='ffformation2' etc

Non.

Ton iLigne ne correspond à aucune variable PHP.
Tu n'es plus sur le serveur, là, tu es sur le client, en JavaScript.

D'ailleurs sur le forum JavaScript, on analyse le JavaScript, pas le PHP

Tu utilises une variable i pour ta boucle, mais tu ne l'utilises pas dans ta boucle.
Tu utilises 200 X ton paramètre iLigne dont la valeur est fixe.

Et ce que te dis SpaceFrog, ce n'est pas que les valeurs des id sont incorrectes, mais que les balises <option> ne sont pas toujours (suivant les nav) autorisées à recevoir un attribut id, même avec une valeur correcte.

A+

**SpaceFrog** · 28/07/2010, 16h20

l'id doit aller dans la balise select
et la recupération se fait par le value du select qui retourne la valmue de l'option selectionnée
il faut donc de value dans les balises option .

**E.Bzz** · 28/07/2010, 16h22

Envoyé par SpaceFrog

il faut donc de value dans les balises option .

Il me semble avoir lu (Bovino ?) que l'attribut value n'était pas obligatoire et que, à défaut, le innerHTML était considéré comme value ...

De là à retrouver le post en question

A+

**SpaceFrog** · 28/07/2010, 16h26

je me méfierais de ce genre de raccourci qui peut s'avérer propriétaire et déclenchera une erreur de validation w3c

**samuel4256** · 28/07/2010, 16h27

"Tu utilises une variable i pour ta boucle, mais tu ne l'utilises pas dans ta boucle.
Tu utilises 200 X ton paramètre iLigne dont la valeur est fixe."
Je ne comprend pas cette phrase, la valeur de iLigne n'est pas fixe, sinon, la fonction ne fonctionnerait pas.
D'ailleurs quand je fais alert(iLigne); ça me renvoie 1 pour la 1ere option, 2 pour la 2e option, 3 pour la 3e etc.

Quand à ma variable $i, elle me sert pour changer le nom de l'id comme indiqué plus haut.

Code :

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

1
2
3
4
foreach($bdd->afficherNomSFormationS() as $key=>$formation){
				echo'<option id="ffformation'.$i.'" align="center">'.$formation.'</option>' ;
				$i++ ;  
				}

Donc pour chaque entrée de ma table, je cré une option dond l'id est formation+la valeur de i, qui est incrémenté de 1 à chaque tour.

Je comprend pas du tout ce que vous dites en fait. Je vois pas le problème, ça marche très bien sous FF et IE8 et ça me semble clair et logique.

**Bovino** · 28/07/2010, 16h31

Envoyé par E.Bzz

Il me semble avoir lu (Bovino ?) que l'attribut value n'était pas obligatoire et que, à défaut, le innerHTML était considéré comme value ...

De là à retrouver le post en question

A+

Oui, mais pas pour IE (ou du moins apparemment, IE < 8)

D'où je pense le sujet de cette discussion

**samuel4256** · 28/07/2010, 16h35

Ok merci je vais donc essayer de passer par des value pour IE voir si ça règle mon problème

**SpaceFrog** · 28/07/2010, 16h38

oui donc supprimes les id des option et mets l'id sur le select
le value est alors celui du select

si pas de selection le value sera = -1

**E.Bzz** · 28/07/2010, 16h38

Envoyé par Bovino

Oui, mais pas pour IE (ou du moins apparemment, IE < 8)

D'où je pense le sujet de cette discussion

Merci pour les confirmations et précisions

Envoyé par samuel4256

Je comprend pas du tout ce que vous dites en fait.

Essentiellement, je pense, car tu parles de PHP, alors que nous ne parlons que de JavaScript.

Quant au fonctionnement sous FF, je pense que tu n'as que l'impression que ça fonctionne correctement (même si le résultat affiché est celui que tu attends), car l'anomalie n'est pas visible. Relis les réponses précédentes

Ceci dit, je dis ça parce que je considère comme une anomalie le fait de lancer 200 X un traitement qui pourrait n'être lancé qu'une fois.
Mais ce n'est peut être pas un avis partagé

A+

**samuel4256** · 29/07/2010, 13h47

J'ai modifié mon script en rajoutant des value, les option apparaissent correctement dans ma liste mais lorsque je souhaite les récupérer dans mon javascript, l'option est "coupée" au 1er espace, exemple, j'ai "Agent d'entretien du bâtiment" dans ma liste déroulante, je le récupère en javascript, je fais un alert et ça me renvoie "Agent"...une idée ?