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

**dev2010** · 29/07/2010, 00h09

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

Code html :

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
<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

rovider, 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.

**Watilin** · 29/07/2010, 01h25

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

**RomainVALERI** · 29/07/2010, 03h50

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 ^^

**SpaceFrog** · 29/07/2010, 08h59

Sinon je ne vois pas de contre-indication a créer un thead en 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
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>

**le_chomeur** · 29/07/2010, 09h41

il serait préférable de ne recréer que le tbody

( le contenu , et non pas le contenant ^^

**dev2010** · 29/07/2010, 13h00

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.

**SpaceFrog** · 29/07/2010, 13h03

tbody pas body....

et mets l'id sur le table

Code :

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

document.getElementById('montab').tbody

**dev2010** · 29/07/2010, 14h06

bonjour:
voici le squelette du code du tableau:

Code :

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

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 :

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

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?

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

JavaScript

Discussions similaires

Partager

Partager