Cacher une partie d'un tableau (colonnes) proprement ?
Salut à tous,
J'ai un problème simple que je n'arrive pas à régler. C'est probablement plus du HTML que du javascript.
J'ai crée le tableau suivant :
http://s2.noelshack.com/uploads/imag..._untitled1.jpg
Avec le code suivant :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
| <table border="1" bordercolor="#3c3c3c" cellspacing="0" cellpadding="5">
<tr bgcolor="#96ca2d">
<th><font color="#ffffff" type="bold">Nom</font></th>
<th><font color="#ffffff">Prénom</font></th>
<th><font color="#ffffff">E-mail</font></th>
<th><font color="#ffffff">Code Op</font></th>
<th><font color="#ffffff">Photo</font></th>
<th id="titreLv2" style="display:none"><font color="#ffffff">LV2</font></th>
<th id="titreOrdi" style="display:none"><font color="#ffffff">Ordinateur</font></th>
<th id="titreConnex" style="display:none"><font color="#ffffff">Internet</font></th>
</tr>
<xsl:for-each select="contact/etudiant">
<tr>
<td onclick="affiche(this.value)"><b><xsl:value-of select="nom"/></b></td>
<td><xsl:value-of select="prenom"/> </td>
<td><xsl:value-of select="mail"/> </td>
<td><xsl:value-of select="code_op"/> </td>
<td><img><xsl:attribute name="src"><xsl:value-of select="photo" /></xsl:attribute></img> </td>
<td id="contenuLv2" style="display:none"><xsl:value-of select="lv2"/></td>
<td id="contenuOrdi" style="display:none"><xsl:value-of select="ordi"/></td>
<td id="contenuConnex" style="display:none"><xsl:value-of select="connexion"/></td>
</tr>
</xsl:for-each>
</table> |
Avec mon lien au dessus du tableau, j'affiche d'autres colonnes qui sont en "style=display:none" par défaut.
Lorsque je les affiche, la structure du tableau n'est pas respectée :
http://s2.noelshack.com/uploads/imag..._untitled2.jpg
Problèmes :
- la dernière colonne de titre contient 3 lignes qui sont censées être mes 3 colonnes titres cachées...
- les données correspondantes (les 3 lignes à fond blancs apparues) ne marche que pour la première entrée. Alors qu'elle proviennent d'un xsl:for-each qui fonctionne pour les colonnes précédentes.
J'ai testé de passer les champs à afficher/cacher en "visiblity=hidden" ça a l'air de régler le problème mais le tableau laisser un espace vide là où sont cachés les colonnes, c'est donc très moche.
Quelqu'un a une idée pour arranger ça ?
Merci :)
J'ajoute mon code Javascript au cas où mais je pense que le problème ne vient pas de là
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
|
function toggle(monId) {
var monElement = document.getElementById(monId);
if(monElement.style.display == 'none')
monElement.style.display = 'block';
else
monElement.style.display = 'none';
}
function toggleOn(monId) {
var monElement = document.getElementById(monId);
monElement.style.display = 'block';
}
function toggleOff(monId) {
var monElement = document.getElementById(monId);
monElement.style.display = 'none';
}
function afficheInfos(){
toggle("titreLv2");
toggle("titreOrdi");
toggle("titreConnex");
toggle("contenuLv2");
toggle("contenuOrdi");
toggle("contenuConnex");
} |
