Cacher les lignes d'un tableau

**azorol** · 02/05/2013, 01h16

Bonsoir,

J'ai adapter pour mes besoins une fonction qui permet de cacher les lignes d'un tableau et de les faire apparaitre, mais apparemment ça bug quelques part...

J'ai tester sur IE et FF et c'est pareil, lorsque je clic sur + ça me met toutes les lignes dans la premiere colonne et ainsi de suite. Je n'arrive pas les avoir sur toute la ligne...

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
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>
<script language="javascript">
function voir(chaine){
 
var a = document.getElementById('L2');
var b = document.getElementById("L3");
 
if (chaine == 'montrer2'){a.style.display = "block";}
if (chaine == 'cacher2'){a.style.display = "none";}
 
if (chaine == 'montrer3'){b.style.display = "block";}
if (chaine == 'cacher3'){b.style.display = "none";}
 
}
</script>
</head>
 
<body>
<table width="67%" border="1">
  <tr>
    <td width="17%">Colonne 1 </td>
    <td width="14%">Colonne 2 </td>
    <td width="16%">Colonne 3 </td>
    <td width="13%">Colonne 4 </td>
    <td width="13%">Colonne 5 </td>
    <td width="13%">Colonne 6 </td>
    <td width="14%">Colonne 7 </td>
  </tr>
  <tr>
    <td>Titre colonne 1 </td>
    <td>Titre colonne 2 </td>
    <td>Titre colonne 3 </td>
    <td>Titre colonne 4 </td>
    <td>Titre colonne 5 </td>
    <td>Titre colonne 6 </td>
    <td>Titre colonne 7 </td>
  </tr>
  <tr>
    <td>Ligne 1 
    <input type="button" name="bouton_voir1" value="+" onclick="voir('montrer2')" /></td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr id="L2" style="display:none">
    <td>Ligne 2 
      <input type="button" name="bouton_voir2" value="-" onclick="voir('cacher2')" />
      <input type="button" name="bouton_voir2a" value="+" onclick="voir('montrer3')" /></td>
    <td>sdfsfsd</td>
    <td>sdfsdf</td>
    <td>sdfsd</td>
    <td>fsdf</td>
    <td>sdfsd</td>
    <td>fsd</td>
  </tr>
  <tr id="L3" style="display:none">
    <td>Ligne 3
      <input type="button" name="bouton_voir3" value="-" onclick="voir('cacher3')" /></td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>
</body>
</html>

Merci pour vos conseils ou aides.

Cordialement.

**saymoneu** · 02/05/2013, 10h35

Bonjour,

A la place de

Code javascript :

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

if (chaine == 'montrer2'){a.style.display = "block";}

essayez :

Code javascript :

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

if (chaine == 'montrer2'){a.style.display = "table-row";}

**azorol** · 02/05/2013, 16h20

Merci bcp pour cette réponse rapide.

Bonne journée.

Cacher les lignes d'un tableau

JavaScript

Discussions similaires

Partager

Partager