créer une entête d'un tableau en javascript.

Version imprimable

bonjour,
j'ai crée un tableau dont le script de son entête est le suivant:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<thead>
            <tr>
              <th rowspan="2" scope="col">Station</th>
              <th rowspan="2" scope="col">Taux de fonctionnement</th>
              <th colspan="6" scope="col">Nombre d'intervention,categorie:</th>
              <th rowspan="2" scope="col">Nombre d'evennement</th>
              <th colspan="3" scope="col">Condition d'environnement</th>
              <th rowspan="2" scope="col">Historique</th>
            </tr>
            <tr>
              <th scope="col">Provider</th>
              <th scope="col">Communication</th>
              <th scope="col">Alimentation</th>
              <th scope="col">Digitaliseur</th>
              <th scope="col">Capteur</th>
              <th scope="col">condition d'environnement</th>
              <th scope="col">Temperature</th>
              <th scope="col">Hummidite</th>
              <th scope="col">Pression d'aire</th>
            </tr>
       </thead>

ce qu'il y a de spéciale dans cette entête est que, il y a des cellules composées deux 2 lignes, exemple:
la 3ième cellule contient deux lignes:
1- Nombre d'intervention,categorie:
2-contient 6 cellules :Provider, communication, alimentation, digitaliseur, capteur, condition d'environnement.
ce tableau s'actualise via ajax, c'est pour ça que je vous demande de m'aider à recréer cet entête en js,
merci d'avance.

29/07/2010, 01h25
Watilin

Bonsoir,
c’est le genre de truc fastidieux par excellence. Tu es sûr d’avoir besoin de le recréer à chaque transaction Ajax ? Si tu gardes une référence sur les cellules à mettre à jour, tu peux modifier juste le contenu sans altérer la structure de la table, et ça fait également moins de boulot pour le navigateur ;)
29/07/2010, 03h50
RomainVALERI

Citation:

Envoyé par Watilin

Bonsoir,
c’est le genre de truc fastidieux par excellence. Tu es sûr d’avoir besoin de le recréer à chaque transaction Ajax ? Si tu gardes une référence sur les cellules à mettre à jour, tu peux modifier juste le contenu sans altérer la structure de la table, et ça fait également moins de boulot pour le navigateur ;)

+1, et en plus ça sera plus facile de conserver la compatibilité crossbrowser de cette manière ^^

Sinon je ne vois pas de contre-indication a créer un thead en js

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<script type="text/javascript">
var thhd= document.createElement('thead')
var thtr=document.createElement('tr')
var thth=document.createElement('th')
thth.innerHTML="coucou"
 
function bar(){
for(i=0;i<5;i++){
   var hcel=thth.cloneNode(true)
	thtr.appendChild(hcel)
	}
thhd.appendChild(thtr)
document.getElementById('foo').appendChild(thhd)	
}
</script>
</head>
 
<body onload="bar()">
<table id='foo'>
</table>
</body>
 
</html>

29/07/2010, 09h41
le_chomeur

il serait préférable de ne recréer que le tbody ;) ( le contenu , et non pas le contenant ^^
29/07/2010, 13h00
dev2010

bonjour à tous,
merci pour vos aides,
c'est vrais, je veux mettre à jour que la partie <body> du mon tableau, j'ai essayé de faire ça à l'aide de l'attribut "id" de la balise <body>, mais malheureusement ça ne fonctionne pas,
c'est pour ça que vous demande plus de détailles sur cet idée,
merci encore.
29/07/2010, 13h03
SpaceFrog

tbody pas body....

et mets l'id sur le table

Code:

document.getElementById('montab').tbody

bonjour:
voici le squelette du code du tableau:
Code:

1 2 3 4 5 6 7 8 9 <table id="tableau" > <thead> .... </thead> <tbody> ... </tbody> </table>
le squelette du code de la fonction js qui recrée le tbody:
Code:

1 2 3 4 5 document.getElementById('tableau').tbody.innerHTML = ""; .. création des lignes du tableau, <tr>, et les placées dans l'objet tbody : boucle: tbody.appendChild(les lignes <tr>);
je ne trouve pas ou est le problème ici?