Well, this isn't triggered by a span, but by a click on the table,
maybe it'll help.
What I needed was to collapse certain rows and show a message to
"Click to expand", but only if javascript was available to do the
hide/unhide (as opposed to hiding it in my css and suddenly having
people not be able to see it without javascript).
WARNING: I'm sure this is not the best way to do this, but it worked
in a pinch. Where it falls apart is when you have tables with varying
numbers of columns - I haven't figured out how to have it count the
columns and set the appropriate colspan.
The table gets a class of .expandTable, and then any rows that need
to be hidden get a class of .collapsed:
<table class="expandTable" >
<tr><td>always visible</td></tr>
<tr class="collapsed"><td>collapse if javascript is available</
td></tr>
</table>
Then, hide all the rows that have a class of .collapsed:
$('.collapsed').hide();
Find the last row in the table, and tack on another row that contains
the "click for more/less" row:
$('tr.collapsed:last-child').after('<tr class="expand"><td>Click to
see more / less</td></tr>');
Then toggle between showing and hiding the collapsed rows on any
click on the table.
$('.stripeMe').click(
function() {$(this).find('.collapsed').toggle(); // show/hide
collapsed rows
}
);
On Feb 6, 2007, at 4:27 AM, halfer wrote:
>
>
> howard chen wrote:
>>
>> show() only work good for DIV tags, but not table, e.g.
>>
>> ----------------------
>>
>> <table>
>> <thead>title...</thead>
>>
>> <tbody id="test" style="display: none;">
>> <tr>
>> <td>22sksksis</td>
>> </tr>
>> <tr>
>> <td>22sksksis</td>
>> </tr>
>> <tr>
>> <td>22sksksis</td>
>> </tr>
>> </tbody>
>>
>> </table>
>>
>> <span onclick="$('#test').show('show');">hello</span>
>>
>>
>
> Yes, this would be unlikely to work, though I've never tried it.
> Extra code
> would need to be written that progressively expands the line height
> of a row
> to an intended final height before moving onto the next one.
> Perhaps writing
> it as a plugin would be a good approach?
> --
> View this message in context: http://www.nabble.com/show%28%29-for-
> table-elements--tf3180071.html#a8824408
> Sent from the JQuery mailing list archive at Nabble.com.
>
>
> _______________________________________________
> jQuery mailing list
> [email protected]
> http://jquery.com/discuss/
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
