Can we have multiple <tbody>
in same <table>
? If yes then in what scenarios we should use multiple <tbody>
views:
218answers:
5According to this example it can be done: http://www.w3.org/TR/html401/struct/tables.html#h-11.2.3.
Grz, Kris.
yes you can, according to this article from a quick google search http://it.toolbox.com/blogs/paytonbyrd/tbody-to-the-rescue-4097
Yes. From the DTD
<!ELEMENT table
(caption?, (col*|colgroup*), thead?, tfoot?, (tbody+|tr+))>
So it expects one or more. It then goes on to say
Use multiple tbody sections when rules are needed between groups of table rows.
Technically, the W3C's HTML spec allows multiple TBODY
elements in a table, but I don't see a case when this would be necessary.
See http://www.w3.org/TR/html401/struct/tables.html#h-11.2.1
Yes you can use them, for example I use them to more easily style groups of data, like this:
<table>
<thead>
<tr><th>Customer</th><th>Order</th><th>Month</th></tr>
</thead>
<tbody>
<tr><td>Customer 1</td><td>#1</td><td>January</td></tr>
<tr><td>Customer 1</td><td>#2</td><td>April</td></tr>
<tr><td>Customer 1</td><td>#3</td><td>March</td></tr>
</tbody>
<tbody>
<tr><td>Customer 2</td><td>#1</td><td>January</td></tr>
<tr><td>Customer 2</td><td>#2</td><td>April</td></tr>
<tr><td>Customer 2</td><td>#3</td><td>March</td></tr>
</tbody>
<tbody>
<tr><td>Customer 3</td><td>#1</td><td>January</td></tr>
<tr><td>Customer 3</td><td>#2</td><td>April</td></tr>
<tr><td>Customer 3</td><td>#3</td><td>March</td></tr>
</tbody>
</table>
Then you can style them easily, like this:
tbody:nth-child(odd) { background: #f5f5f5; }
tbody:nth-child(even) { background: #e5e5e5; }
You can view an example here, it'll only work in newer browsers...but that's what I'm supporting in my current application, you can use the grouping for JavaScript etc. The main thing is it's a convenient way to visually group the rows to make the data much more readable. There are other uses of course, but as far as applicable examples, this one is the most common one for me.