Wikipedia:Collapsible tables

From Wikipedia, the free encyclopedia

Collapsible tables provide a way to collapse and uncollapse a table when a show/hide button is clicked. The code for this feature is found in the MediaWiki:Common.js.

The initial state of any collapsible content can be controlled using a "collapsible table", because it also allows a table with only one element with content, and a header.

Contents

[edit] Simple example

Tables are simpler to work with, as you merely need to add the collapsible to the table itself. For the [hide]/[show] link to appear, the table's first row must be a header row, i.e. begin (in wikisyntax) with an exclamation mark. The use of the class toccolours in the example below is merely for appearance; it is not needed for collapsible to function:

{| class="toccolours collapsible" width="60%"
!colspan="2"| Fun with table columns
|-
| Column 1 || Column 2
|}
Fun with table columns
Column 1 Column 2

[edit] One-element example, initially expanded

{| class="collapsible"
!Always displayed header
|-
|Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text 
|}
Always displayed header
Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text

[edit] Auto-collapsing tables

You have two choices of auto-collapse. In addition to the collapsible class, you can add either collapsed or autocollapse. The first always initially collapses a table. autocollapse only initially collapses a table if there are at least two collapsible tables on a page.

{| class="toccolours collapsible autocollapse" width=60%
|-
! colspan="2" | This autocollapse table will initially collapse because there are at least two collapsible tables on this page.
|-
| Column 1 || Column 2
|}
This autocollapse table will initially collapse because there are at least two collapsible tables on this page.
Column 1 Column 2 
{| class="toccolours collapsible collapsed" width=60%
|-
! colspan="2" | This table will always initially collapse
|-
| Column 1 || Column 2
|}

One-element example, initially collapsed:

[edit] Sortable collapsible tables

initially expanded initially collapsed
numbers
name number
a 123
b 6
c 45

[edit] See also