Mise en forme tableau JS

Bonjour,

j’ai un petit problème tout bète d’affichage d’un tableau JS:

Voici déjà mon code actuel:


TWS_MakeCallByDefaultDevice();

var twsServerName = '192.168.120.20';
var getTokenOnPageLoad = true;
var monArraySeria=[];
var token = null;

if( getTokenOnPageLoad )
	TWS_GetMyToken( null );

function TWS_GetMyToken( callback )
{

	var url = 'http://' + twsServerName + '/fonction;
	var ajax = TWS_GetNewAjax();
	ajax.open( 'GET' , url );
	ajax.onreadystatechange = 	function()
	{
		if( ajax.readyState == 4 )
		{
			var xmlToken = TWS_ParseXml( ajax.responseText );
			token = xmlToken.getElementsByTagName('UserGuid')[0].childNodes[0].nodeValue;
			alert(token);
			TWS_MakeCallByDefaultDevice();
		}
	}
	ajax.send(null);	
}

function TWS_MakeCallByDefaultDevice()
{ 
	if( token == null )
	{
		if( ! getTokenOnPageLoad )
			TWS_GetMyToken( function(){ TWS_MakeCallByDefaultDevice() } );
	}
	else
	{   
		var url = 'http://' + twsServerName + '/autrefonction;

		var ajax = TWS_GetNewAjax();
		ajax.open( 'GET' , url );
		ajax.onreadystatechange = 	function()
		{
			if( ajax.readyState == 4 )
				{
				var xmlToken = TWS_ParseXml( ajax.responseText );
				rteNode = xmlToken.getElementsByTagName('ArrayOfCallLogSimpleInfos');
				var nombre=rteNode[0].childNodes.length; 
				alert(nombre);
				for (i=0; i<nombre; i++)
					{
					var debut=rteNode[0].getElementsByTagName("TimeStart")[i].firstChild.nodeValue;
					var fin=rteNode[0].getElementsByTagName("TimeEnd")[i].firstChild.nodeValue;
					var prenom=rteNode[0].getElementsByTagName("Speaker1FirstName")[i].firstChild.nodeValue;
					var nom=rteNode[0].getElementsByTagName("Speaker1LastName")[i].firstChild.nodeValue;
					var numero=rteNode[0].getElementsByTagName("Speaker1Device")[i].firstChild.nodeValue;
					monArraySeria[i]= '<tr><td>' + debut + '</td><td>' + fin + '</td><td>' + prenom + '</td><td>' + nom + '</td><td>' + numero + '</td><tr>';
					} 
				document.getElementById("mondiv").innerHTML = monArraySeria.join();
				}
		}
		ajax.send(null);
	}
}

function TWS_GetNewAjax()
{
	var ajax = null;
	
	if( navigator.appName == "Microsoft Internet Explorer" )
		ajax = new ActiveXObject( "MSXML2.XMLHTTP.3.0" );
	else
		ajax = new XMLHttpRequest();
	
	return ajax;
}

function TWS_ParseXml( xmlString )
{
	var xml = null;

	if( navigator.appName == "Microsoft Internet Explorer" )
	{
		xml = new ActiveXObject( "Microsoft.XMLDOM" );
		xml.async = "false";
		xml.loadXML( xmlString );
	}
	else
	{
		parser = new DOMParser();
		xml = parser.parseFromString( xmlString , "text/xml" );
	}
	
	return xml;
}

</script>
<table><tr><td>Debut</td><td>Fin</td><td>prenom</td><td>Nom</td><td>Numero</td></tr>
<div id="mondiv"></div>
</table>


Le résultat que je veux afficher est le tableau monArraySeria[i]

le hic, c’est que rien ne s’affiche dans ma div.

A votre avis pourquoi?

merci

Parce que ton javascript est éxécuté avant la création de ta div, donc il met ton html nulle part

malheureusement avant ou après cela ne change rien

Bonjour,

je ne suis pas certain du comportement d’un div dans un table…

de plus, comme akkai ton javascript est exécute avant ce qui peu provoquer des erreurs.

Donc en test je te dirai de mettre l’id de ton div sur ta table pour voir le comportement.

Sinon si tu peux fournir une url de test cela pourrai nous aider à t’aider ^^

Adns

Effectivement enlève ton div à l’intérieur du tableau.
De plus, je te conseillerai plutot d’utiliser le DOM avec document.createElement().
Essaie peut-être:


<table id="resultat">
</table>
<script type="text/javascript">
function TWS_MakeCallByDefaultDevice()
{ 
	if( token == null )
	{
		if( ! getTokenOnPageLoad )
			TWS_GetMyToken( function(){ TWS_MakeCallByDefaultDevice() } );
	}
	else
	{  
		var url = 'http://' + twsServerName + '/autrefonction;

		var ajax = TWS_GetNewAjax();
		ajax.open( 'GET' , url );
		ajax.onreadystatechange = 	function()
		{
			if( ajax.readyState == 4 )
				{
				var xmlToken = TWS_ParseXml( ajax.responseText );
				rteNode = xmlToken.getElementsByTagName('ArrayOfCallLogSimpleInfos');
				var nombre=rteNode[0].childNodes.length; 
				alert(nombre);
				var tableau = document.getElementById("tableau");
				
				var ligne = document.createElement('tr');
				var elem = document.createElement('td');
				var txt = document.createTextNode("Debut"); //
				elem.appendChild(txt);						// Lignes à copier pour Fin, prenom, Nom, Numero		
				ligne.appendChild(elem);					//	
				
				for (i=0; i<nombre; i++)
					{
					var debut=rteNode[0].getElementsByTagName("TimeStart")[i].firstChild.nodeValue;
					var fin=rteNode[0].getElementsByTagName("TimeEnd")[i].firstChild.nodeValue;
					var prenom=rteNode[0].getElementsByTagName("Speaker1FirstName")[i].firstChild.nodeValue;
					var nom=rteNode[0].getElementsByTagName("Speaker1LastName")[i].firstChild.nodeValue;
					var numero=rteNode[0].getElementsByTagName("Speaker1Device")[i].firstChild.nodeValue;
					monArraySeria[i]= '<tr><td>' + debut + '</td><td>' + fin + '</td><td>' + prenom + '</td><td>' + nom + '</td><td>' + numero + '</td><tr>';
					var ligne = document.createElement('tr');
					var elem = document.createElement('td');
					var txt = document.createTextNode(debut); //
					elem.appendChild(txt);						// Lignes à copier pour Fin, prenom, Nom, Numero		
					ligne.appendChild(elem);					//
					tableau.appendChild(ligne);
					} 
				document.getElementById("mondiv").innerHTML = monArraySeria.join();
				}
		}
		ajax.send(null);
	}
}
</script>

Edité le 24/08/2011 à 15:51