Discussion :

[Ben86]

Bonjour,

Toujours dans mon soucis de compatibilité entre les différents explorer, je m'aperçois qu'un de mes tableaux ne se met pas à jour alors que sur notre FF tout fonctionne correctement.

Voici le code JS

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
function refreshTable(donnees)
{
	alert('donneeeees ' +donnees);
	var table = document.getElementById('aff_lot'),
	th = table.getElementsByTagName('thead')[0].getElementsByTagName('th'),
	array = [], retour = "";
	for(var i = 0, l = th.length; i < l; i++) {
		array.push(th[i].innerHTML);
	}
	for(var i = 0, l = (donnees.length < 30) ? donnees.length : 30; i < l; i++) {
	alert(donnees.length);
		var nb = '';
			retour = '';
			donnees.each( 
		function (reponses)
        {
 
		retour += "<tr style='text-align:center;'>"	
		+ '<td>' + reponses.statut + '</td>'
        + '<td>'   + reponses.numero + '</td>'
		+ '<td>'   + reponses.titre + '</td>'
		+ '<td>'   + reponses.code_postal + '</td>'
		+ '<td>'   + reponses.ville + '</td>'
		+ '<td>'   + reponses.id_loi + '</td>'
		+ '<td>'   + reponses.montant_pack + '€ </td>'
		+ '<td>'   + reponses.loyer_lot + '€ </td>'
		+ '<td>'  + + '-- % </td>'
		+ '<td>'  + reponses.taux_com+' % '+ reponses.taux_com_unite + '</td>'
		+ "</tr>";
		nb++;
		}
		);
	}
	alert('retour = ' + retour);
	if(donnees.length > 0) {
 
	alert(table.getElementsByTagName('tbody')[0].innerHTML);
	table.getElementsByTagName('tbody')[0].innerHTML = retour;
	alert(table.getElementsByTagName('tbody')[0].innerHTML);
	}
	else { 
	table.getElementsByTagName('tbody')[0].innerHTML = "<tr><td colspan='10'><p style='font-size:14px; text-align:center; color:midnightblue;'><strong>Aucune réponse ne correspond à votre recherche</strong></p></td></tr>";
	}
 
}

Le alert('retour = ' + retour); renvoie les infos correctes sous IE comme sous FF :S

les trois lignes suivantes renvoies ce qu'il faut sur FF mais pas sur IE

Code :

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

1
2
3
alert(table.getElementsByTagName('tbody')[0].innerHTML); // OK 
table.getElementsByTagName('tbody')[0].innerHTML = retour;
alert(table.getElementsByTagName('tbody')[0].innerHTML); // Pas d'alerte sous IE

merci à vous

[Bovino]

Il y a pas mal de petites erreurs de conception dans ton code...

Code :

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

var table = document.getElementById('aff_lot'),

Si tu utilises Prototype, récupère tes éléments avec $() plutôt que getElementById pour qu'ils puissent être étendus et que tu puisses leur appliquer les méthodes de Prototype.

Code :

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

array = [], retour = "";

en dehors du fait que array est très maladroit comme nom de variable, il vaut mieux utiliser le mot clé var pour déclarer des variables.

Code :

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

donnees.each

donnees n'a pas été étendu via $, or IE a une facheuse tendance à perdre la référence à Prototype, donc l'erreur doit venir du fait qu'il ne reconnait pas each comme une méthode de donnees, tu peux parer à cela simplement en redéclarant donnees en début de fonction :

Code :

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

1
2
3
function refreshTable(donnees)
{
    donnees = $(donnees);

[Ben86]

Bonjour,

Merci pour cette réponse mais même après modification, j'ai toujours le même résultat sous IE.

Non IE ne perd pas les données car elles sont affichées dans un div (pour le test) et elles s'affichent correctement ... Donc je problème ne vient pas de là.

Je te donne le code MAJ.

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
 
 
function refreshTable(donnees)
{
	donnees = $(donnees);
	alert(donnees);
 
	var table = document.getElementById('aff_lot'),
	th = table.getElementsByTagName('thead')[0].getElementsByTagName('th'),
	montableau = [], retour = "";
	for(var i = 0, l = th.length; i < l; i++) {
		montableau.push(th[i].innerHTML);
	}
	for(var i = 0, l = (donnees.length < 30) ? donnees.length : 30; i < l; i++) {
 
		var nb = '';
			retour = '';
			donnees.each( 
		function (reponses)
        {		
		retour += '<tr>'	
		+ '<td>' + reponses.statut + '</td>'
        + '<td>'   + reponses.numero + '</td>'
		+ '<td>'   + reponses.titre + '</td>'
		+ '<td>'   + reponses.code_postal + '</td>'
		+ '<td>'   + reponses.ville + '</td>'
		+ '<td>'   + reponses.id_loi + '</td>'
		+ '<td>'   + reponses.montant_pack + '€ </td>'
		+ '<td>'   + reponses.loyer_lot + '€ </td>'
		+ '<td>'  + + '-- % </td>'
		+ '<td>'  + reponses.taux_com+' % '+ reponses.taux_com_unite + '</td>'
		+ "</tr>";
		nb++;
		}
		);
	}
 
	if(donnees.length > 0) {
	alert(table.getElementsByTagName('tbody')[0].innerHTML);
	document.getElementById('affichage').innerHTML = retour;
	table.getElementsByTagName('tbody')[0].innerHTML = '';
	table.getElementsByTagName('tbody')[0].innerHTML = retour;
 
	alert(table.getElementsByTagName('tbody')[0].innerHTML);
	}
	else { 
	table.getElementsByTagName('tbody')[0].innerHTML = "<tr><td colspan='10'><p style='font-size:14px; text-align:center; color:midnightblue;'><strong>Aucune réponse ne correspond à votre recherche</strong></p></td></tr>";
	}
 
}

Sous IE // document.getElementById('affichage').innerHTML = retour; donne la réponse dans le div de la bonne manière ... donc le problème viendrait de l'actualisation du table.

Merci encore

[Ben86]

Aucune idée ?

[gwyohm]

Si tu utilises prototype, utilise le jusqu'au bout :
les document.getElementById('xxx') doivent devenir des $('xxx')
les .innerHTML = 'xxx'; doivent devenir des .update('xxx');
les .getElementsByTagName('xxx') doivent passer par des .select('xxx');
etc etc

Je pense que le problème vient de .innerHTML dans les table et je pense que la méthode update règle le problème, même si le mieux serait de faire ça en DOM.

[Ben86]

Effectivement, après réalisation de tes explications tout fonctionne.

Où as-tu appris ça ? Il y a une doc spécifique ? (Fr ou En)


merci encore

[gwyohm]

Où as-tu appris ça ? Il y a une doc spécifique ? (Fr ou En)

http://www.prototypejs.org/api