pb avec display:table-row d'une <tr> sous ie

Version imprimable

12/02/2006, 14h45
bibile

pb avec display:table-row d'une <tr> sous ie
Bonjour,

Je fais ca pour modifier le style DISPLAY d'une <tr>:
Code:

1 2 var P_tr = document.getElementById("ligne2"); P_tr.style.display = "none";
en HTML j'ai:

Code:

<tr id="ligne2" style="display:table-row;">

sous firefox, le js marche tres bien.
sous ie, ca plante et j'ai ca comme erreur:

Citation:

Impossible d'obtenir la propriete display. Argument non valide.

Si au lieu de "table-row" dans le HTML j'ai "block", et bien alors ca marche sous ie.

Qu'est-ce que je peux faire pour que ca fonctionne sous ie avec le "table-row" ? c'est parce qu'il y a un "-" qu'il plante ?

bonjour,

en faisant comme ceci :
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 25 26 27 28 29 30 31 32 33 34 35 36 37 <html> <head> <title></title> <script type="text/javascript">  </script> </head> <body> <table> <tr style="display:table-row;"> <td> ligne 1 </td> </tr> <tr id="ligne2" style="display:table-row;"> <td> ligne 2 </td> </tr> <tr style="display:table-row;"> <td> ligne 3 </td> </tr> </table> <input type="button" value="Bouton" id="BNom" onclick="test()" > </body> </html>
je n'ai aucun problème sous IE (v5) et FireFox. A quel moment le "display: none" est-il appelé ?

Si je ne me trompe pas, les styles table-cell, table-column, table-row, ... sont censés s'appliquer sur des balises de type div.

merci bcp pour ton exemple.
j'avais simplifié le mien en pensant bien faire. mais en fait, le pb ne se pose que dans 1 sens.

j'ai modifié ton exemple (la ligne 2 est caché et je veux l'afficher avec le table-rox).
et bien, ca me donne l'erreur sous ie:
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 25 26 27 28 29 30 31 32 33 34 35 36 <html> <head> <title></title> <script type="text/javascript">  </script> </head> <body> <table> <tr style="display:table-row;"> <td> ligne 1 </td> </tr> <tr id="ligne2" style="display:none;"> <td> ligne 2 </td> </tr> <tr style="display:table-row;"> <td> ligne 3 </td> </tr> </table> <input type="button" value="Bouton" id="BNom" onclick="test()" > </body> </html>
apparement, il y a bien un bug ie

a la place de table-row, je peux utiliser display=block, mais ca me pose un autre probleme, sous firefox cette fois :?

12/02/2006, 17h11
Auteur

en effet.

En toute franchise, jouer à afficher ou à cacher des lignes d'un tableau en utilisant la propriété display n'est pas recommandé.

voici un exemple qui permet d'ajouter un ligne à ton tableau :
http://javascript.developpez.com/faq/?page=Table
12/02/2006, 18h45
bibile

merci pour les insertRow et deleteRow. je ne connaissais pas !
au pire, je ferai avec ca.

ca va quand meme sensiblement rallonger mon code parce que les lignes de ma table etaient assez chargées :(

y a pas de 2ieme methode pour cacher/decacher des <tr> ?

Après quelques recherches j'ai trouvé cet exemple :

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
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
 
<html>
<head>
<title></title>
 
<script type="text/javascript">
<!--
function CacheLigne()
{
 var eTab = document.getElementById("tab")
 eTab.rows[1].style.display="none";
}
function MontreLigne()
{
 var eTab = document.getElementById("tab")
 eTab.rows[1].style.display="";
}
//-->
</script>
 
</head>
 
<body>
<table id="tab">
  <tr>
    <td>ligne 1
    </td>
  </tr>
  <tr>
    <td>ligne 2
    </td>
  </tr>
  <tr>
    <td>ligne 3
    </td>
  </tr>
</table>
<input type="button" value="Cache" id="BNom" onclick="CacheLigne()">
<input type="button" value="Montre" id="BNom" onclick="MontreLigne()">
 
</body>
 
</html>

ça n'a pas l'air de poser de problème sous IE et FF.

13/02/2006, 11h12
bibile

ha !!!!
merci :D

en fait, le gros truc, c'est que je n'avais pas pensé faire ca:

Code:

style.display=""