Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Lead:  Liav Nadler   

Status
colourYellow
titleongoing
     

Related Pages: Data Tables


Table of Contents

Description

A tree table is a type of data table, where each row can be expanded to reveal related child rows

Image RemovedImage Added

Usage & Behaviour

A tree table is similar to a basic table, with the exceptions described below:

  • The first column of the table (e.g Name):
    • Cannot be moved
    • Contains icons on each row, allowing the user to expand and collapse them
  • The first row will be expanded by default, unless otherwise specified
  • Expanding a row will reveal at least one child row
  • On child rows:
    • The text of the first column is indented in relation to parent rows
    • All other cells may be similar to the parent rows or blank (if child row does net share the same values)
  • If the table has a checkboxes column, clicking a parent checkbox will check all child checkboxes. For more information see Checkboxes 
  • Table rows may be draggable (see example above). For more information see Drag & Drop
  • Child rows will have a predefined sort
  • Sorting any column will sort only the parent rows, keeping child rows intact (including the collapse / expand state)

...