Demonstrates how you can add subheaders, footnotes and other insertions into your data table
Agile UI Demo v5.0-dev
Table with various headers
Action | Amount |
|---|---|
| This is sub-header, goes inside "thead" tag | |
| This is part of body, goes before other rows | |
| Salary | € 200.00 |
| This goes above row with ID=2 (Purchase goods) | |
| Purchase goods | € -120.00 |
| Tax | € -40.00 |
| manually injected row after Tax | € -0.02 |
| This will appear above totals | |
| Totals: | € 79.98 |
Columns with multiple formats
Single column can use logic to swap out formatters
Action | Amount | Amount Copy |
|---|---|---|
| Salary | Refunded: € 200.00 | € 200.00 |
| Purchase goods | Refunded: € -120.00 | € -120.00 |
| Tax | Refunded: € -40.00 | too little to matter |
Table with resizable columns
Just drag column header to resize
Action | Amount | Amount Copy |
|---|---|---|
| Salary | € 200.00 | € 200.00 |
| Purchase goods | € -120.00 | € -120.00 |
| Tax | € -40.00 | € -40.00 |