Remplacement Valeur Vs Concatenation

[snipes]

Salut tout le monde
je voudrais savoir comment fait-on pour remplacer des valeurs ajouter par exemple apres un click ?
exemple :
j ai un lien, lorsque je click sur ce dernier je fais un appel a ajax qui me fait apparaitre des valeurs dans un div mais lorsque je reclick de nouveau sur ce lien ou sur un autre lien les données se mettent a la suite

ma question : comment faire pour effacer les donnees affiché au prealable pour ensuite ajouter les nouvelles ?

ps : je me demande si l'erreur ne vient pas du fait que j'ai creer un tableau pour afficher les données ?

ps 1 : je sais pas vraiement si c'est un probleme ajax ou js mais je savais pas ou poster

Mon Code :

Code :

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
 
function recup_pizza(xhr,num_pizza)
{
	if(xhr.readyState == 4)
	{
		var reponse = xhr.responseXML;
		var items = reponse.getElementsByTagName("pizza");				
		var table = document.createElement("table");
 
		// on parcourt toutes les balises
		for(var i=0;i<items.length;i++)
		{									
			/* me donne le nom des pizza
			alert(reponse.getElementsByTagName("pizza")[i].getElementsByTagName('nom')[0].firstChild.data);
			*/
			// si la pizza desiré est reperé
			if(reponse.getElementsByTagName("pizza")[i].getElementsByTagName('id')[0].firstChild.nodeValue == num_pizza)
			{
				var tr = document.createElement('tr');	
				for(j=0;j< reponse.getElementsByTagName("pizza")[i].getElementsByTagName('ingredient').length;j++)
				{
					td = document.createElement('td');
					txt = document.createTextNode(reponse.getElementsByTagName("pizza")[i].getElementsByTagName('ingredient')[j].firstChild.data);
					td.appendChild(txt);
					tr.appendChild(td);				
				}
				table.appendChild(tr);				
			}
 
		}		
		document.getElementById('ecran').appendChild(table);
 
	}
 
}

[Herode]

C'est un problème d'algorithme. Ici, à chaque appel de recup_pizza(), tu crées une table que tu remplis et que tu ajoutes à ton document. Si tu veux effacer les résultats précédents, tu peux par exemple (1) supprimer la table précédente avant d'en créer une nouvelle, ou encore (2) récupérer la table déjà créée et supprimer les lignes (<tr>) périmées avant de la remplir à nouveau.

Tu peux aussi attribuer un id à la table pour la manipuler :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
function recup_pizza(xhr,num_pizza)
{
  var mytbl = document.getElementById('mytbl');
  if( !!mytbl )  mytbl.parentNode.removeChild(window.mytbl);

  if(xhr.readyState == 4) 
  {
    var reponse = xhr.responseXML;
    var items = reponse.getElementsByTagName("pizza");			    var table = document.createElement("table");
    table.setAttribute('id', 'mytbl'); 
[...]

Si tu ne veux ou ne peux pas attribuer d'id valide, passe par un pointeur anonyme :

Code :

1
2
3
4
5
6
7
8
9
10
11
12
13
function recup_pizza(xhr,num_pizza)
{
  if( !!window.mytbl ) { 
  window.mytbl.parentNode.removeChild(window.mytbl);
  window.mytbl = null;
  }
  if(xhr.readyState == 4)
  {
    var reponse = xhr.responseXML;
    var items = reponse.getElementsByTagName("pizza");			    var table = document.createElement("table");
    window.mytbl = table; 
[...]

etc.