My issue is that I want to allow users to hide and show expanded data.
Yet for some reason, when I implement this in jQuery, the expanded
rows always seem to stay in a single column, instead of returning back
to the full table width. I can get it to work in prototype, but jquery
won't.
Anyone else have problems with show()?
This is my example:
[code]
<script type="text/javascript">
jQuery.noConflict();
function jqueryclick( node ) {
var sibling = jQuery( node ).next('tr');
sibling.toggle('slow');
// $( node ).next('.expanded').toggle();
}
function prototypeclick( node ) {
$( node ).next('.expanded').toggle();
}
</script>
</head>
<body>
<table border=1>
<thead>
<tr>
<th>TEST1</th>
<th>Test 2</th>
<th>Test 3 3</th>
</tr>
</thead>
<tbody id="tablebody">
<tr onclick="jqueryclick(this)">
<td>hey jude!</td>
<td>I want</td>
<td>some</td>
</tr>
<tr class="expanded">
<td>big</td>
<td>top</td>
<td>ice cream</td>
</tr>
<tr onclick="prototypeclick(this)">
<td>1+1=</td>
<td>2+2=</td>
<td>3+3=</td>
</tr>
<tr class="expanded">
<td>2</td>
<td>4</td>
<td>6</td>
</tr>
</tbody>
</table>
</body>
</html>
[/code]
