First things first, and I could be wrong here, but I believe that the
correct syntax for a table is:
<table>
<thead></thead>
<tfoot></tfoot>
<tbody></tbody>
</table>
Not sure several tbody elements is correct... anyway, I did some test,
and got some freaky results, I think that the problem lies with the
style "display: block" being applied, works fine in IE7 but not very
pretty in FF... you can test this:
$(".collapse_group").click( function () {
$(this).parent().siblings("tr").slideToggle("fast");
});
I'm sorry that I don't have a definite answer to your question though.
What I would do is probably make another table inside a tr with the
data and wrap it in a div and see if that would work, OR maybe have a
callback to the slideToggle that changes the display style depending
whether it visible or not...
good luck though, someone here most probably have a better answer, but
this is something to get you started :P
//Kristinn
On 2/21/07, rolfsf <[EMAIL PROTECTED]> wrote:
>
> I misspoke - now that I look at it closer and play with jquery.accordian, I
> don't want it to function like an accordion menu, since I want each grouping
> to be toggled independent of each other -- they could all be open, or all
> closed.
> sorry for the confusion...
>
>
> rolfsf wrote:
> >
> > I'm trying to figure out how to build a table that allows the user to
> > toggle groups of rows, much like the accordion menus made with Jörn's
> > accordion plugin, while keeping reasonably semantically correct markup in
> > the table.
> >
> > My best guess on the markup is posted here:
> > http://www.monkeypuzzle.net/testfiles/jquery/Accordion_table/
> >
> > briefly, it's something like:
> >
> > <table>
> > <thead>
> > <tr>
> > <th>heading</>
> > <th>heading</>
> > </tr>
> > </thead>
> >
> > <tbody>
> > <tr class="accordion">
> > <th colspan="2" class="collapse_group">Grouping name 1</th>
> > </tr>
> > <tr>
> > <td>data</>
> > <td>data</>
> > </tr>
> > <tr>
> > <td>data</>
> > <td>data</>
> > </tr>
> > </tbody>
> >
> > <tbody>
> > <tr class="accordion">
> > <th colspan="2" class="collapse_group">Grouping name 1</th>
> > </tr>
> > <tr>
> > <td>data</>
> > <td>data</>
> > </tr>
> > <tr>
> > <td>data</>
> > <td>data</>
> > </tr>
> > </tbody>
> >
> > ...etc
> > </table>
> >
> > I want to be able to click on the "Grouping" <th> and collapse/expand the
> > rest of the rows in that <tbody>, but leaving the <tr class="accordion">
> > visible.
> >
> > Can someone get me started? :-)
> >
> > thanks!
> >
> >
>
> --
> View this message in context:
> http://www.nabble.com/accordion-table%2C-instead-of-an-accordion-list-menu--tf3264032.html#a9073436
> 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/
