I’ve been somewhat stumped trying to create some JavaScript to successfully collapse table rows, but I think I’ve finally come up with something that seems to work pretty well. I tried setting display: none;
on the TR
element and on each TD
element, but when I set display: block;
Gecko browsers don’t display the row correctly.
What seems to work is putting a span around the content of each cell and setting display: none;
on each span. With the content removed from each cell, the row collapses nicely. This could be a bit verbose if you’re trying to target rows randomly, but it you only wnat to hide and show a single row (known in advance) this seems to do the trick.
Anyone have other/better ideas I should look at?