Discussion :

[Nicolas94]

Bonjour,

Je génère le contenu de mon Tableau via une fonction 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
 
.....
		var j=0;
		for (i=1; i<=NbWeeks; i++){
			var newRow = document.getElementById('calendar').insertRow(-1);
			var newCell = newRow.insertCell(0);
			newCell.innerHTML = ItemLundi.item(j).firstChild.data;
			newCell = newRow.insertCell(1);
			newCell.innerHTML = ItemMardi.item(j).firstChild.data;
			newCell = newRow.insertCell(2);
			newCell.innerHTML = ItemMercredi.item(j).firstChild.data;
			newCell = newRow.insertCell(3);
			newCell.innerHTML = ItemJeudi.item(j).firstChild.data;
			newCell = newRow.insertCell(4);
			newCell.innerHTML = ItemVendredi.item(j).firstChild.data;
			newCell = newRow.insertCell(5);
			newCell.innerHTML = ItemSamedi.item(j).firstChild.data;
			newCell = newRow.insertCell(6);
			newCell.innerHTML = ItemDimanche.item(j).firstChild.data;
			j++;
		}
......

Tout fonctionne bien. Sur ma page de rendu j'ai un lien qui rappelle la fonction avec des paramètres différents.

Le problème :
Lors du rappel de la fonction celle ci m'ajoute le nouveau contenu du tableau en dessous du 1er contenu.

Ce que j'aimerais c'est que ca réinitialise le Tableau et que ca rajoute les nouvelles datas.

Cordialement,
Nico.

[Apollinaire]

Bonjour,

Effectivement il semblerait que c'est ce que vous lui demandez de faire.
Essayez en effaçant le contenu de "calendar" avant votre boucle for.

Bonne continuation.

[Nicolas94]

Bonjour,

Euh, c'est justement pour ça que j'ai posté. Car je ne sais pas effacer le contenu du tableau :p

Donc si qq1 pouvait m'aider

Cordialement,

[Apollinaire]

En fait, il est possible de faire simplement document.getElementById('calendar').innerHTML=""
mais IE ne veut pas remplacer le contenu d'un table, uniquement d'une ligne.

Le plus simple est à mon avis de créer le tableau dans son ensemble et de supprimer/l'ajouter dans une div entourant le table.

Donc du type :
<div id="conteneur">
Ici il y aura le tableau
</div>

Donc il faudra le re-générer dans son ensemble mais pour le remplacement il n'y aura aucun problème (et même pas besoin de l'effacer).

[Nicolas94]

ok merci.
je vais voir ca

[Nicolas94]

Je reviens pour avoir donc une réponse à ma question de départ.
Comment puis faire pour que lorsque je relance la fonction, la ligne précédente ne réapparaisse pas. En gros supprimer le tboby ajouter précédemment

Appolinaire, je te mets un code ci dessous pour apporter une réponse à ton Pb IE.

Ci dessous le code compatible IE :

tbody = document.createElement ("tbody");
tr = document.createElement ("tr");

td1 = document.createElement ("td");
txt1 = document.createTextNode ("valeur cellule1");
td1.appendChild (txt1);

td2 = document.createElement ("td");
txt2 = document.createTextNode ("valeur cellule2");
td2.appendChild (txt2);

tr.appendChild(td1);
tr.appendChild(td2);

tbody.appendChild(tr);

document.getElementById('ID_table').appendChild(tbody);

[Apollinaire]

Merci (mais je n'ai pas le problème donc pas moyen de tester mais je doute un peu pour le tbody qui change la donne avec IE).

Autrement, ma solution ne convenait pas ?

Avec la fonction JS, créer l'ensemble du tableau et ensuite l'insérer dans le div correspondant (ce qui efface naturellement ce qu'il y avait si l'on passe par innerHTML) ?

[Nicolas94]

Apolinaire, ma solution marche tres bien, en fait c'est l'interpretation de IE au niveau DOM qui necessite un tbody.

Bref, cela ne resout pas mes problèmes a savoir supprimer le Tbody généré.

[Eric2a]

Salut,

Si on identifie TBody à l'aide de l'ID : TBodyId

Nous pourrions faire cela

Code :

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

1
2
3
var tableID = document.getElementById('ID_table');
var old = document.getElementById('TBodyId');
tableID.removeChild(old);

[Nicolas94]

Erica, j'aimerais bien tester ta solution mais je ne sais pas affecter un ID a mon Tbody en JS.

Dans mon code je fais ca:

Code :

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

1
2
 
tbody = document.createElement ("tbody");

Peux tu m'aider pour spécifier un ID ? afin que je puisse tester ton code.
Merci.

[Apollinaire]

Re,

tbody.id='TBodyId';

[Nicolas94]

Bon,

Pour add un ID c'est :

Code :

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

1
2
 
tbody.id="TBodyId";

Ensuite j'ai testé ton code qui me supprime en faite le 1er TR
Je m'explique mon code génére plusieurs <TR></TR> dans le Tbody

Je vais essayé de faire une boucle et/ou trouver un système pour supprimer tout les TR trouvé :p

Je reviens des kjai ca. Vous pouvez m'aider si vous avez des codes sous la main biensur :p

Merci.
A tte.

PS : Pas vu ton Post Apolinaire

[Apollinaire]

Y a pas de mal mais normalement le code donné par Eric2a devrait enlever tout le contenu. En affichant le contenu du table, on retrouve bien tous les tr dans le tbody ?

Edit : En faisant un alert(tableID.innerHTML); avant la suppression par exemple...

[Nicolas94]

Excelent, ça fonction en fait je suis désolé.

Je mettais la creation de mon Tbody dans un boucle ce qui faisait que j'en généré plusieurs donc c'est bon c'est ok Mo Tbody Ce delete Bien

Merci à vous pour votre aide

Pour finir, comment pourrais je détecter la présence ou pas d'un Tbody afin de lancer le code dans un if.

Ex: If Tbody exist ... code de erica.

[Nicolas94]

Bon,

J'ai fait comme ça :

Code :

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

1
2
3
4
5
6
 
	if (document.getElementById('TBodyId')!=null){
		var tableID = document.getElementById('tab_calendar');
		var old = document.getElementById('TBodyId');
		tableID.removeChild(old);
	}

Je sais pas si c'est des plus propre mais bon ca fonctionne.
Je vous remercie pour tout.

Cordialement,

Nico.

[Apollinaire]

Plus propre il y a :

if(document.getElementById('TBodyId').length!==false)

Bonne soirée.

[Nicolas94]

ça fonctionne pas
Je ne sais pas pourquoi Apo.

[Eric2a]

Je suis arrivé après la bataille

Code :

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

1
2
3
4
5
6
 
var old=document.getElementById('TBodyId');
if (old){
	var tableID = document.getElementById('tab_calendar');
	tableID.removeChild(old);
}

[Nicolas94]

Mieux vaut tard que jamais :p
Merci ça fonctionne