Discussion :

[yann.morineau]

Bonjour,

Je bosse sur un site e-commerce.
Tu cliques sur un produit, les infos du produit se charge dans un div.
Dans ces infos se trouve un select (taille) lui même chargé par une fonction javascript.
Que la liste soit vide ou non :
Sous Firefox pas de problème, la liste apparait normalement.
Sous Internet Explorer, la liste apparait 1/4 de seconde et puis plus rien.

Je ne comprends pas.

Le bouton qui charge le div :

Code :

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

1
2
3
4
 
<?php
<a style="cursor: Pointer" onclick="javascript:produit('<?php echo $cat;?>','<?php echo $sscat;?>','<?php echo $val['ref'];?>'); taille2('<?php echo $val['ref'];?>','<?php echo $val['couleur'];?>');"><img width="80" height="110" src="http://www.colorcuir.com/graph/catalogue/femme/mini/<?php echo $val['ref'];?>a.png"></a><br />
?>

La fonction taille2 :

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
 
function taille2(ref,couleur){
 
				var taille = CreateXMLHttpRequest ();
				var method = 'GET';
				var filename = 'inc/taille.php?ref='+ref+'&couleur='+couleur+'&taille=';
				taille.open(method, filename, true);
				taille.onreadystatechange = function(){
 
					if(taille.readyState == 4)
					{
						var tmp = taille.responseText;
						document.getElementById('taille').innerHTML = tmp;
					}
				}
				taille.send(null);				
			}

la page taille.php appelée par 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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
 
<?php
                                                                                require_once ('xxxxx.php');
                                                                                
                                                                                //récupération des GET
                                                                                        $ref = mysql_real_escape_string($_GET['ref']);
                                                                                        $couleur = mysql_real_escape_string($_GET['couleur']);
                                                                                ?>
									<input type="hidden" name="reference" id="reference" value="<?php echo htmlentities($ref);?>" />
									<input type="hidden" name="couleur" id="couleur" value="<?php echo htmlentities($couleur);?>"	/>
									<select id="selecttaille" name="selecttaille" onchange='taille(this.value);'>
										<?php
                                                                                
                                                                                if (isset($_GET['taille']))
                                                                                {
                                                                                                $taille = intval($_GET['taille']); 
                                                                                                
                                                                                                //affichage des taille  
                                                                                                        $reqtaille = mysql_query("SELECT * FROM stock WHERE ref='".$ref."' AND couleur='".$couleur."' ORDER BY taille ASC") or die ("pb select taille");
                                                                                                        while($donneestaille = mysql_fetch_array($reqtaille))
                                                                                                        {
                                                                                                                if($donneestaille['quantite'] != 0)
                                                                                                                {
                                                                                                                        
                                                                                                                        if($donneestaille['taille'] == $taille)
                                                                                                                        {
                                                                                                                                ?>
																<option value="<?php echo $donneestaille['taille']; ?>" selected="selected"><?php echo $donneestaille['taille']; ?></option>
																<?php
                                                                                                                        }
                                                                                                                        if($donneestaille['taille'] != $taille)
                                                                                                                        {
                                                                                                                        ?>
																<option value="<?php echo $donneestaille['taille']; ?>"><?php echo $donneestaille['taille']; ?></option>
															<?php
                                                                                                                        }
                                                                                                                }
                                                                                                        }
                                                                                }
                                                                                mysql_close();
                                                                                ?>
									</select>

et enfin le div dans lequel est chargé la liste :

Code :

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

1
2
 
<td width="30" height="30"><form id="prod" name="prod"><span id="taille"></span></form></td>

Je vous remercie d'avance pour votre aide.
Habituellement j'arrive à trouver sans demander mais là...

Edit : http://www.colorcuir.com
catalogue => femmes => vestes courtes => première photo

J'ai tout passé au Firebug et Debugger pour IE
Pas d'erreur rencontrée.

[DoubleU]

Ouais c'est bizarre, chez moi ca marche bien de temps en temps.

Dans ton code php, tu retournes un select avec un event attaché (onchange=taille). Ca je ne suis pas sur que IE soit capable de très bien le gérer quand tu ajoutes ton select à la page via innerHTML.

Ce que tu devrais faire, au lieu de créer ton sélect coté php et de le coller dans ta div quand tu récupères ta réponse ajax, c'est de renvoyer les infos qui vont te permettre de le recréer coté client, via le DOM.

[yann.morineau]

Salut,

Ouais c'est bizarre, chez moi ca marche bien de temps en temps.

Dans ton code php, tu retournes un select avec un event attaché (onchange=taille). Ca je ne suis pas sur que IE soit capable de très bien le gérer quand tu ajoutes ton select à la page via innerHTML.

Lors de ma première version du site j'ai utilisé la fonction onchange, elle fonctionnait parfaitement sous IE. Mais c'est vrai la page "infos produit" était unique, elle ne passait pas par innerHTML.
Ca ne fonctionne pas non plus sous IE7.

Ce que tu devrais faire, au lieu de créer ton sélect coté php et de le coller dans ta div quand tu récupères ta réponse ajax, c'est de renvoyer les infos qui vont te permettre de le recréer coté client, via le DOM.

Tu veux dire, construire le select en javascript?

IE est vraiment pénible, et dire que beaucoup de monde l'utilise.

Merci de ta réponse

[yann.morineau]

Re,

Je viens de faire un test en appelant un select simple.
La premiere fois que le select est appelé pas de problème, il reste, mais la deuxième non.

Si tu regarde bien ma fonction taille2, j'ai oublié d'ajouter une variable aléatoire pour éviter que deux requêtes identiques ne soient appelées.

Je corrige çà et te tiens au courant.

[yann.morineau]

C'est bon !!!

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
 
function taille2(ref,couleur){
				var count = Math.random();
				var taille = CreateXMLHttpRequest ();
				var method = 'GET';
				var filename = 'inc/taille.php?ref='+ref+'&couleur='+couleur+'&count='+count+'&taille=';
				taille.open(method, filename, true);
				taille.onreadystatechange = function(){
 
					if(taille.readyState == 4)
					{
						var tmp = taille.responseText;
						document.getElementById('taille').innerHTML = tmp;
					}
				}
				taille.send(null);				
			}

j'ai ajouté une "var count = Math.random(); " afin que chaque requête soit unique.

QUAND MEME