[Résolu] Cacher, afficher une ligne de tableau <TR> en Javascript

Cacher, afficher une ligne de tableau <TR> en Javascript [Résolu] - HTML/CSS - Programmation

Marsh Posté le 26-03-2009 à 17:12:13    

Bonjour
 
J'ai cherché ça pendant un bon moment, et comme mes recherches google n'est pas été très fructueuses, j'ai décidé de venir poster la solution ici.
 
Le problème : Lorsqu'on veut afficher une ligne de tableau en fonction d'un évènement, on charge la ligne avec comme attribut style="display:none".

Code :
  1. <TABLE>
  2.      <TR style="display:none" id="ma_ligne">
  3.           <TD>blabla</TD>
  4.      </TR>
  5. </TABLE>


 
Mais lorsqu'en javascript on veut ré-afficher cette ligne <TR> en faisant :
       

Code :
  1. document.getElementById('ma_ligne').style.display="block";


 alors le tableau ne ressemble plus à rien !  :(  
 
Finalement il suffit d'écrire :

Code :
  1. document.getElementById('ma_ligne').style.display="";


 
 :)  
 
PS : Le bug n'apparaissait pas chez moi sous IE7 mais sous Firefox.


Message édité par gaboul49_2 le 04-04-2009 à 23:37:07
Reply

Marsh Posté le 26-03-2009 à 17:12:13   

Reply

Marsh Posté le 26-03-2009 à 17:20:45    

Ouais, ce n'est pas un bug, c'est Firefox qui a un comportement normal. Par défaut une ligne d'une table (TR) à un attribut "display" positionné à "table-row" et non "block".
 
C'est pour ça, que pour cacher une ligne mieux vaut passer par className et quelques règles CSS, plutôt que de bidouiller directement avec la propriété display.

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed