Discussion :

[alex4488]

Bonjour,

Voilà, j'ai deux listes liés dynamiquement, la deuxième liste déroulante se remplit en fonction du choix de la première en ajax.

Le script marche très bien sous Firefox mais pas sous IE.

Est-ce que quelqu'un aurait déjà rencontré ce problème ? Et y aurait-il une solution à adapter pour que çà fonctionne sous IE.

Merci.

[llaffont]

Lorsque tu opères dans ton SELECT, as tu un flag jaune en bas à gauche de ta fenêtre IE ?

Si Oui c'est que tu as une erreur Script ou pagination que FF corrige mais pas IE.

[Bovino]

Le script marche très bien sous Firefox mais pas sous IE.

Tu es aussi explicite qu'un message d'erreur de IE

Mais à priori, il s'agit d'un sujet récurrent dont je m'étonne que tu ne l'ai pas trouvé avec une recherche

IE accepte mal l'attribution dynamique du name, donc cela pose ensuite problème pour la transmission du formulaire en question.

[alex4488]

Bonjour,

llaffont : Non je n'ai pas de flag jaune dans ma fenêtre IE.


Oui, je n'ai pas été très explicite.

J'ai cherché sur plusieurs forums une solution à ce problème mais n'a pas trouvé.


Voilà le code que j'utilise pour aider à comprendre.



Le fichier php qui est affiché avant la requête Ajax (gestion_savoir_faire.php) :

Code php :

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
<?
if(isset($_POST['hi_action_savoir_faire']))
if($_POST['hi_action_savoir_faire'] <> "")
{
gerer_savoir_faire();
}
?>
 
<form enctype="multipart/form-data" name="fo_savoir_faire" id="fo_savoir_faire" method="post" style="margin-left:20px" action="">
<input type="hidden" name="hi_action_savoir_faire" id="hi_action_savoir_faire" value="" />
<input type="hidden" id="hi_id_savoir_faire" name="hi_id_savoir_faire" value="" />
 
 
////LISTE DES SAVOIR-FAIRES
 
<div id="liste_savoir_faire_metiers">
<?
// Ceci est un tableau réalisé avec une classe PHP, le clic sur une ligne de ce tableau va déclencher la requête Ajax (envoyer_texte()
 
$dg->printTable();
 
?>
</div>
 
<div id="choix_savoir_faire">
 
<?
//// SELECTION DU SAVOIR-FAIRE ////
?>
 
<input type="text" id="te_nouveau_nom_savoir_faire" name="te_nouveau_nom_savoir_faire" disabled="disabled" size="40" />
 
<?
//// MODIFIER SAVOIR-FAIRE ////
?>
 
<input type="button" value="" id="bt_modifier" name="bt_modifier" onclick="javascript:envoyer('Modifier')" disabled="disabled" />
 
<?
//// SUPPRIMER SAVOIR-FAIRE ////
?>
 
<input type="button" value="" id="bt_supprimer" name="bt_supprimer" onclick="javascript:envoyer('Supprimer')" disabled="disabled" />
 
</div>
 
</form>

Les fonctions javascript (celle qui utilise Ajax et la fonction qui submit le formulaire) (gestion_savoir_faire.php) :

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
function envoyer_texte(id_savoir_faire)
{
var xhr = getXhr();
xhr.onreadystatechange = function(){
 
if(xhr.readyState == 4 && xhr.status == 200){
leselect = xhr.responseText;
document.getElementById('choix_savoir_faire').innerHTML = leselect;
}
}
 
xhr.open("POST","selectionner_savoir_faire.php",true);
xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
xhr.send("id_savoir_faire="+id_savoir_faire);
 
document.getElementById('hi_id_savoir_faire').value = id_savoir_faire;
}
 
 
function envoyer(parametre)
{
document.getElementById('hi_action_savoir_faire').value = parametre;
document.fo_savoir_faire.action = "admin.php?partie=gestion_savoir_faire";
document.fo_savoir_faire.submit();
}

Et voilà mon fichier qui est appelé par l'Ajax (selectionner_savoir_faire.php)

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
<?
session_start();
 
include ("fonctions.php");
 
$verif = "SELECT count(*) AS nb FROM savoir_faire WHERE id_savoir_faire = '".$_POST['id_savoir_faire']."' AND id_langue = '".$_SESSION['id_langue']."' AND etat = 0";
 
$exec_verif = mysql_query($verif) or die(mysql_error());
 
$resultat = mysql_fetch_array($exec_verif);
 
if($resultat['nb'] == 1)
{
$select_savoir_faire = "SELECT libelle FROM savoir_faire WHERE id_savoir_faire = '".$_POST['id_savoir_faire']."' AND id_langue = '".$_SESSION['id_langue']."' AND etat = 0";
}
else
{
$select_savoir_faire = "SELECT libelle FROM savoir_faire WHERE id_savoir_faire = '".$_POST['id_savoir_faire']."' AND id_langue = '".$_SESSION['id_langue_defaut']."' AND etat = 0";
}
 
$exec_select_savoir_faire = mysql_query($select_savoir_faire) or die(mysql_error());
 
$savoir_faire = mysql_fetch_array($exec_select_savoir_faire);
 
?>
 
<?
//// SELECTION DU SAVOIR-FAIRE ////
?>
 
 
<input type="text" id="te_nouveau_nom_savoir_faire" name="te_nouveau_nom_savoir_faire" value="<? echo $savoir_faire['libelle'] ?>" size="40" />
<?
//// MODIFIER SAVOIR-FAIRE ////
?>
<input type="button" value="" id="bt_modifier" name="bt_modifier" onclick="javascript:envoyer('Modifier')" />
<?
//// SUPPRIMER SAVOIR-FAIRE ////
?>
<input type="button" value="" id="bt_supprimer" name="bt_supprimer" onclick="javascript:envoyer('Supprimer')" />

Et voici en plus une partie de mon fichier qui contient la fonction traitant le formulaire (fonction_gestion_savoir_faire.php) :

Code php :

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
<?php
 
function gerer_savoir_faire() {
 
$action = $_POST['hi_action_savoir_faire'];
 
switch($action)
{
 
case 'Modifier' :
///traitement des variables du tableau, vzrification validitz
 
//Cette variable est bien récupéré car l'élément hi_id_savoir_faire n'a pas été remplacé par l'Ajax
$id_savoir_faire = $_POST['hi_id_savoir_faire'];
 
//C'est à partir de là que la fonction plante, le POST n'arrive pas à être récupérer sous IE
$nom_savoir_faire_modifie = $_POST['te_nouveau_nom_savoir_faire'];
 
return true;
 
break;
 
case 'Supprimer' :
 
....
 
Ce cas fonctionne bien.
 
....
 
return true;
 
break; 
 
}
 
}

Voilà, si cela peut aider quelqu'un à trouver la solution de ce problème,
cela m'aiderait beaucoup. Merci

[alex4488]

J'ai remarqué un détail qui pourrait aider à trouver la solution.

C'est au niveau du innerHTML dans le Javascript.

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
function envoyer_texte(id_savoir_faire, id_savoir_faire)
	{
	var xhr = getXhr();
 
	xhr.onreadystatechange = function(){
 
	if(xhr.readyState == 4 && xhr.status == 200){
 
                // affiche le résultat de la requête Ajax
                alert(xhr.responseText);
 
		leselect = xhr.responseText;
					   document.getElementById('choix_savoir_faire').innerHTML = leselect;
 
                // affiche le contenu de la div actualisé avec Ajax
                alert(document.getElementById('choix_savoir_faire').innerHTML);	
				}
			}
 
			// Ici on va voir comment faire du post
			xhr.open("POST","selectionner_savoir_faire.php",true);
			// ne pas oublier ça pour le post
			xhr.setRequestHeader('Content-Type','application/x-www-form-urlencoded');
			// ne pas oublier de poster les arguments
			xhr.send("id_savoir_faire="+id_savoir_faire);
 
			document.getElementById('hi_id_savoir_faire').value = id_savoir_faire;
	}

Il y a des différences entre les deux alerts.

Dans le deuxième alert, les id et name des éléments comme un input text ne sont pas mis entre guillemets ainsi que la value qui n'est pas renseigné.
Donc, après ma requête, je récupère des éléments formulaires dont l'id et le name sont mal écrits.

Si quelqu'un sait comment faire pour que ce innerHTML fonctionne correctement, ce serait sympa.

Merci.

[alex4488]

C'est bon j'ai trouvé mon problème,

C'était la ligne :

$dg->printtable();

qui générait un tableau contenant un formulaire

Il y avait donc un formulaire imbriqué dans le formulaire destiné à être traité, ce qu'Internet Explorer ne pouvait pas gérer.