Discussion :

[faico]

Salam,
Je souhaite replir un tableau avec javascript ,les données dont on se sert pour rmplir sont Obtenu à partir d'un formulaire .
Pour cela j'ai crée une fonction qui s'execute suite à une click sur un boutton ,voila ma fonction :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
var html=document.getElementById('TabAddRouleau').innerHTML;
	var tab=html.split("</TBODY>");
	html=tab[0];
	html=html+"\n<TR>";
	html=html+"\n<TD>"+document.form2.rouleau.value+"</TD>";
	html=html+"\n<TD>"+document.form2.mr.value+"</TD>";
	html=html+"\n<TD>"+document.form2.chuteT.value+"</TD>";
	html=html+"\n<TD>"+document.form2.defaut.value+"</TD>";
	html=html+"\n</TR>\n";
	html=html+"</TBODY>";
	alert (html);
document.getElementById('TabAddRouleau').innerHTML=html;

Avec firefox cela marhe bien mais avec IE5 il me donne l'erreur suivate :

Code :

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

 une erreur d'éxecution inconnue !

[javatwister]

eh bien en fait, après 3 lectures, je n'ai toujours pas compris ce que tu voulais faire;

[javatwister]

ah si d'accord...

et ton tableau est-il complètement vide avant que tu tentes de le remplir?

ou alors tu cherches à créer une nouvelle ligne?

[FremyCompany]

1/ Ca marche pas si il n'y a pas de tbody (il se peut que le navigateur l'enlève juste pour optimiser le code
2/ si la balise est écrite en minuscule (comme dans les conventions XHTML), ca ne marche pas non plus..

Cela me semble la meilleure solution (changer le innerHTML peut avoir des effets dévastateur sur les scripts ayant une variable pointant sur un objet HTML... en effet, le changement de innerHTML écrase tous les anciens objets et en crée de nouveau) :

Code :

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

1
2
3
var tr=document.createElement("tr");
tr.innerHTML=html;
table.tBodies[0].appendChild(tr)

[javatwister]

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
<table id="TabAddRouleau">
	<tr>
		<th>un</th>
		<th>deux</th>
		<th>trois</th>
		<th>quatre</th>
	</tr>
</table>
 
 
<form id="f" action="">
 
<p>
<input type="text" name="rouleau" />
<input type="text" name="mr" />
<input type="text" name="chuteT" />
<input type="text" name="defaut" />
</p>
 
<p>
<input type="button" onclick="addr(this.form.elements)" value="ajouter la ligne" />
</p>
 
</form>
 
 
<script type="text/javascript">
 
var t=document.getElementById("TabAddRouleau").tBodies[0];
var tr, td;
 
function addr(f){
 
	tr=document.createElement("tr");
	for(i=0;i<4;i++){
		td=document.createElement("td");
		td.appendChild(document.createTextNode(f[i].value));
		tr.appendChild(td);
	}
 
	t.appendChild(tr)
 
}
 
</script>

[faico]

Salam,
J'ai fait un astuce :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
var html=document.getElementById('DivTabAddRouleau').innerHTML;
	var tab=html.split("</TBODY>");
	html=tab[0];
	html=html+"\n<TR>";
	html=html+"\n<TD>"+document.form2.rouleau.value+"</TD>";
	html=html+"\n<TD>"+document.form2.mr.value+"</TD>";
	html=html+"\n<TD>"+document.form2.chuteT.value+"</TD>";
	html=html+"\n<TD>"+document.form2.defaut.value+"</TD>";
	html=html+"\n</TR>\n";
	html=html+"</TBODY></table>";
	alert (html);
document.getElementById('DivTabAddRouleau').innerHTML=html;

Est cela marche bien !
Merci à vous tous
Et specialement à Toi FremyCompany !