[jQuery] Show/Hide multiple table rows. Pls help
Hi, I have a problem i've been trying to solve for a while. I have a
table that is dynamically generated. I need to be able to hide and
show certain table rows. for e.g.
<table>
<thead>
<tr>
<td><heading1></td>
<td><heading2></td>
<td><heading3></td>
</tr>
</thead>
<tbody>
<tr>
<td>DATA1</td>
<td>DATA1.2</td>
<td>DATA1.3</td>
</tr>
<tr> -----
<td>data1</td> |
<td>data1.2</td> | dynamically generated by an
array when page loads, <td>data1.3</td> can be
more table data rows and is to be hidden.
| To be shown when
DATA1 is clicked
</tr> |
<tr> |
<td>data1</td> |
<td>data1.2</td> |
<td>data1.3</td> |
</tr> ------
<tr>
<td>DATA2</td>
<td>DATA2.2</td>
<td>DATA2.3</td>
</tr>
<tr> -----
<td>data2</td> |
<td>data2.2</td> | dynamically generated by an
array when page loads, <td>data2.3</td> can be
more table data rows and is to be hidden.
| To be shown when
DATA2 is clicked
</tr> |
<tr> |
<td>data2</td> |
<td>data2.2</td> |
<td>data2.3</td> |
</tr> ------
</tbody>
</table>
I'd like to know how i can show/hide the tr's that are dynamically
generated. i'm also using tablesorter, so i want the rows to be
associsted with their respective DATA, i.e. they are not mixed up.
data1 or data1.2 does not come under DATA2. I tried every which way
to try the show/hide, the JQuery Table Display plugin doesnt seem to
do the job.
Pls can someone help!!