[javascript]CreateElement

Version imprimable

Bonjour à tous,

J'ai un problème avec ce script:

Dans mon code javascript:
Code:

1 2 3 4 5 6 7 8 9 my_row=document.createElement("TR"); for(var i=0;i<xmlres.length;i++) { var my_cell=document.createElement("TD"); my_cell.style.background="rgb(255,0,0)"; my_row.appendChild(my_cell); } document.getElementById('PROGRESS').appendChild(my_row);
dans ma page html
Code:

1 2 <TABLE width='80%' align='center' border=1 id='PROGRESS'></TABLE>
Pourquoi ça ne fonctionne pas ???? :oops: :cry: :cry:

Merci de votre aide !!!

15/02/2006, 19h12
SpaceFrog

parceque appendChild ne fonctionne que dans un tbody ...

ajoute un tbody à ton tableau ...
16/02/2006, 08h40
LE NEINDRE

ok, je vais tenter cela.
Mais qu'est-ce qu'un tbody ???
16/02/2006, 09h07
SpaceFrog
c'est ce qui va sous un theader ...

d'ailleur IE et Ffx le simulent si tu ne l'as pas mis ...
pour t'en convaincre essaye de récupérer le firstChild.NodeName il te retournera TBODY ...

sinon la struicture devrait ressembler à ça ...
Code:

1 2 3 4 5 6 7 8 9 <table> <theader> </theader> <tbody> <tr> <td>..</td> </tr> </tbody> <table>

Génial !!!
ça marche !!

Meric beaucoup pour ton aide. J'ai fait:

pour le javascript
Code:

1 2 3 4 5 6 7 8 9 my_row=document.createElement("TR"); for(var i=0;i<xmlres.length;i++) { var my_cell=document.createElement("TD"); my_cell.style.background="rgb(255,0,0)"; my_row.appendChild(my_cell); } document.getElementById('PROGRESS').appendChild(my_row);
Dans le code HTML:
Code:

1 2 print "<TABLE class=\'div_style2\'><TBODY id='PROGRESS'></TBODY></TABLE>\n";
Il me reste encore une dernière question à poser, si ça ne te dérange pas :oops: !!
Lorsque je créé un TD avec
Code:

1 2 var my_cell=document.createElement("TD");
Est il possible de lui attribuer un ID et un STYLE ???
Si oui, par quel diabolique stratagème !! :?

16/02/2006, 09h33
SpaceFrog
pour l'id rien de plus simple:
Code:

1 2 3 var my_cell=document.createElement("TD"); my_cell.id="montd" //éventuellement +indice il ne doit y avoir qu'un seul id
pour ce qui est du style ...
plusieurs possibilités:
soit directement dasn la balise td:

Code:

var my_cell.style.cssText="background-color:red;color:blue"

ou alors en ayant des class

Code:

var my_cell.className="NomdeClass"

entre autres possibilités ...
16/02/2006, 09h35
LE NEINDRE

C'est parfait.

Tout marche nickel !!!
Merci encore pour ton aide ! :D :D

Salut SpaceFrog,
je reviens vers toi car j'ai voulu formater un peu mon truc en faisant uyne fonction qui créé la progress bar, comme ceci:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 function CreateProgressBar(total) { var my_table=document.createElement("TABLE"); var my_row=document.createElement("TR"); for(var i=0;i<total;i++) { var my_cell=document.createElement("TD"); my_cell.id="TD"+i; my_cell.style.background="#9933cc"; my_row.appendChild(my_cell); } my_table.style.className='Div_style2'; my_table.appendChild(my_row); document.getElementById('PROGRESSBAR').appendChild(my_table); }
L'id 'PROGRESSABR' fait référence à un TBODY qui est dans une cellule d'un autre tableau.

Et , diantre, ça ne fonctionne plus.

Saurais tu pourquoi ???

16/02/2006, 17h30
SpaceFrog

Code:

my_cell.style.backgroundColor ="#9933cc";

ensuite tu ne tu ne fais pa de

Code:

createElement('tbody')

...

Dans mon code HTML j'ai:

Code:

1
2
3
 
<TR><TD colspan='2' width='100%' id='PROGRESSBAR'>
</TD></TR>

Dans le javascript

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
function CreateProgressBar(total)
{
      var my_tbody=document.createElement("TBODY");
      var my_table=document.createElement("TABLE");
      var my_row=document.createElement("TR");
 
      for(var i=0;i<total;i++)
      {
            var my_cell=document.createElement("TD");
            my_cell.id="TD"+i;
            my_cell.style.backgroundColor="rgb(255,0,0)";
            my_row.appendChild(my_cell);
      }
 
      my_table.style.className='Div_style2';      
      my_table.appendChild(my_row);
      my_tbody.appendChild(my_table);
      document.getElementById('PROGRESSBAR').appendChild(my_tbody);
}

Et toujours rien ?? :cry: :cry: :oops: :oops:

16/02/2006, 17h59
SpaceFrog

heu je n'ai pas l'impression que tu appendes comme il faut ...

append le td dans le tr
append le tr dans le tbody
append le tbody dans le table ...
16/02/2006, 18h06
LE NEINDRE

Mais quel idiot, mais quel idiot !!!! :x :x

ça fonctionne maintenant.

Merci beaucoup ! :wink:
17/02/2006, 08h27
denisC

Pour info sur les tbody:

Citation:

Envoyé par W3C

<!ELEMENT TABLE - -
(CAPTION?, (COL*|COLGROUP*), THEAD?, TFOOT?, TBODY+)>

http://www.w3.org/TR/REC-html40/struct/tables.html#h-11.2.1

TR n'est pas un des enfants possibles d'une table d'après la norme HTML 4.01