Collapsible tables

[resplin]

Obsolete Pages{{Obsolete}}

The official documentation is at: http://docs.alfresco.com

Collapsible tables are an alternative to NavFrames they're easier to use and implement, but are not accessibility friendly due to their inherit table nature.  Code is found in the Common.js and is actively maintained by R. Koot.

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.

Table of Contents

• 1 Simple example


• 2 One-element example, initially expanded


• 3 Auto-collapsing tables


• 4 One-element example, initially collapsed


• 5 Sortable collapsible tables


• 6 See also

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:

 Fun with table columns
 Column 1 
 Column 2

Column 1	Column 2

One-element example, initially expanded

Always displayed header
Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text

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
|}

This table will always initially collapse
Column 1	Column 2

One-element example, initially collapsed

Always displayed header
Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text Optionally displayed text

Sortable collapsible tables

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

Temp header 1
Temp header 2 Hi there!

See also

• {{mlm|Help:Collapsing}}
  

Navigational templates