Discussion :

[X260SH]

Bonjour !
J'ai, dans une page HTML, un bouton select qui me permet (en JS) de charger un document XML dans un tableau HTML, lui même dans un <div id="destination">. Mon code est le suivant :

Code HTML :

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

1
2
3
4
5
6
7
8
9
10
11
12
<article>
	<form name="formulaire">
		<select name="select">
			<option value="Caverner">Caverne</option>
			<option value="Ville">Ville</option>
			<option value="Mer">Mer</option>
		</select>
		<input type="button" value="Afficher" onclick="verification()" />
		<input type="text" name="result" style="display:none;"/>
	</form>
	<div id="destination"></div>
</article>

Et le JavaScript :

Code JavaScript :

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
 
function verification()
{
	var noeud = document.getElementById('destination');
	while (noeud.childNodes.length>0) {
	noeud.removeChild(noeud.firstChild);}
	formulaire.result.value = formulaire.select.value+".xml";
	if (window.XMLHttpRequest)
	{// code for IE7+, Firefox, Chrome, Opera, Safari
	xmlhttp=new XMLHttpRequest();
	}
	else
	{// code for IE6, IE5
	xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
	}
	xmlhttp.open("GET",formulaire.result.value,false);
	xmlhttp.send();
	xmlDoc=xmlhttp.responseXML; 
 
	// endroit on l'on va ajouter la TABLE
	var oDest = document.getElementById('destination');
	// Eléments manipulés
	var oText, oCell, oRow, oTable = document.createElement('TABLE');
	var x=xmlDoc.getElementsByTagName("BETE");
 
	oRow  = oTable.insertRow(); //Nouvelle ligne
 
	oCell = oRow.insertCell(); //On y insère la première cellules.
	oCell.setAttribute('colspan', 4); //On la met en colspan 2.
	oText = document.createTextNode(formulaire.select.value);	 //On écrit dedans.
	oCell.appendChild( oText); //Et on l'envoie.
 
	for (i=0;i<x.length;i++) {
	oRow  = oTable.insertRow();
 
	oCell = oRow.insertCell();
	oText = document.createTextNode(i);	
	oCell.appendChild( oText);
 
	oCell = oRow.insertCell();
	oText = document.createTextNode(x[i].getElementsByTagName("NOM")[0].childNodes[0].nodeValue);	
	oCell.appendChild( oText);
 
	oCell = oRow.insertCell();
	oText = document.createTextNode(x[i].getElementsByTagName("TAILLE")[0].childNodes[0].nodeValue);	
	oCell.appendChild( oText);
 
	oCell = oRow.insertCell();
	oText = document.createTextNode(x[i].getElementsByTagName("POURCENTAGE")[0].childNodes[0].nodeValue);	
	oCell.appendChild( oText);
	}
	// ajout TABLE créée
	oDest.appendChild( oTable);
}

Mais il y a un problème...
Soit, ça ne marche que sur Firefox, soit ça me mets les lignes et les colonne dans le sens contraire...
J'ai quelques essaie, et je vois qu'en plus, dans un tableau quelconque, il y a un espace transparent (comme un padding) dans chaque cellule du tableaux.

[NoSmoking]

Bonjour,
as tu essayé de préciser la positon d'ajout, même si par défaut c'est -1 donc en fin de table.

Code :

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

oRow  = oTable.insertRow(-1);

[X260SH]

Ca ne change malheureusement rien...

[NoSmoking]

Ton code me paraît correct, essaies peut être avec des document.createElement, ou alors mets nous un exemple en ligne que l'on puisse se rendre compte du phénomène.

Es tu sûr de l'ordre des données, la première colonne est-elle chrono ?