fonctions expand/collapse pour tableaux
bonjour tous,
je suis nouveau en javascript et j'ai le code suivant en html, il permet d'afficher des tableaux de données, je voulais ajouter la possibilité de cacher qq lignes du tableau (expand/collapse) dans ce cas ce sont les lignes commençant par 'procedure1' et 'procedure2' en plus je voulais ajouter une fonction (bouton par exemple) permettant d'appliquer cette fonctionnalité pour plusieurs tableaux existant dans la même page au même temps.
quelqu'un peut m'aider ?
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
|
<TABLE BORDER="1" CELLPADDING="1" CELLSPACING="0" WIDTH="100%">
<tr><a name="table_name"></a><td bgcolor=blue> <A HREF="path_for_data"><FONT SIZE=2><img src="path_for_image" width="15" height="10" border="0"></FONT></A> <FONT COLOR=FFFFFF><B>Results</B></FONT></td>
<td bgcolor=blue align=center><FONT COLOR=FFFFFF><B>context1</B></FONT></td>
<td bgcolor=blue align=center><FONT COLOR=FFFFFF><B>context2</B></FONT></td>
<td bgcolor=blue align=center><FONT COLOR=FFFFFF><B>context3</B></FONT></td>
<td bgcolor=blue align=center><FONT COLOR=FFFFFF><B>context4</B></FONT></td>
<td bgcolor=blue align=center><FONT COLOR=FFFFFF><B>context5</B></FONT></td>
</tr>
<tr><td colspan=6 align=left><B>tests</B></td>
<tr>
<td align=left><A HREF="test1"><FONT SIZE=2><img src="path_for_image" width="15" height="10" border="0"></FONT></A> <A HREF=""><FONT SIZE=2>procedure1</FONT></A> </td>
<td align=center>45</td>
<td align=center><FONT COLOR="green"><B>45</B></FONT></td>
<td align=center><FONT COLOR="green"><B>100.0</B></FONT></td>
<td align=center><FONT SIZE=2>date</FONT></td>
<td align=center><FONT SIZE=2> time</FONT></td>
</tr>
<tr>
<td align=left><A HREF="test1"><FONT SIZE=2><img src="path_for_image" width="15" height="10" border="0"></FONT></A> <A HREF=""><FONT SIZE=2>procedure2</FONT></A> </td>
<td align=center>45</td>
<td align=center><FONT COLOR="green"><B>45</B></FONT></td>
<td align=center><FONT COLOR="green"><B>100.0</B></FONT></td>
<td align=center><FONT SIZE=2>date</FONT></td>
<td align=center><FONT SIZE=2> time</FONT></td2
</tr>
<tr><td align=left> <B>results1</td>
<td align=center>90</td>
<td align=center><FONT COLOR=orange><B>89</B></FONT></td>
<td align=center><FONT COLOR=orange><B>98.9</B></FONT></td>
<td align=center> - </td>
<td align=center><FONT SIZE=2> total_time</FONT></td>
</tr>
<tr><td colspan=6 align=left><B>results2</td>
<tr><td colspan=6 align=left><B>results3</B> </td>
<tr><td colspan=6 align=left><B>Statistics</B></td>
<tr><td align=left><FONT SIZE=2>Total </FONT></A></td>
<td align=center>90</td>
<td align=center><FONT COLOR=orange><B>89</B></FONT></td>
<td align=center><FONT COLOR=orange><B>98.9</B></FONT></td>
<td align=center> - </td><td align=center><FONT SIZE=2> total_times</FONT></td>
</tr>
</table> |
