Lead: Liav Nadler
| Status | ||||
|---|---|---|---|---|
|
Related Pages: Data Tables
| Table of Contents |
|---|
...
A dynamic table is a type of a Data Table, allowing users to add, delete and/or reorder rows
...
Usage & Behaviour
Structure
The Typically, the dynamic table is similar to an Inline Editing Table, including a header row and an action column
In addition, the dynamic table has a unique toolbar, including three icons:
Add new row
Move up
Move down
If the top row is selected, the move up icon is disabled
if the bottom row is selected, the move down icon is disabled
If no row is selected, the move up and move down icons are disabled
Zero State
In Zero state only two elements appear:
The toolbar (with the Add New Row icon enabled)
A short message: You can add items to the list by clicking the + icon above
...
the table shows one row with blank fields
In this case all icons are disabled
...
Interaction
Clicking the Add New Row icon creates a new row under the header row, in editing mode
Clicking the Move Up icon replaces the selected row with the row above it
Clicking the Move Down icon replaces the selected row with the row below it
For editing and deleting row see Inline Editing Tables
If the table becomes higher than its container, a scroll bar will appear
...