Table actions
Add row or column actions to a table when a reader should filter, drill, or open more detail straight from a row instead of leaving the table to find it.
| Region | Rep | Product | Revenue |
|---|---|---|---|
| AMER | Rep 3 | Plan A | $1,560,200 |
| EMEAFilter to EMEA | Rep 1 | Plan A | $1,234,500 |
| APAC | Rep 2 | Plan B | $842,300 |
| LATAM | Rep 4 | Plan C | $398,100 |
What you can do
- A table’s panel-level
onClickbinds the whole clicked row as the action’s datum, using the sameElementClickAction(filter,drill, oropenOverlay) any chart panel uses; there is no separate per-row action property. - Every actionable row is one tab stop;
EnterorSpaceactivates it the same as a click, so a table’sonClickis keyboard-reachable without extra markup. - A panel-level
contextMenu.actionsright-click menu works on atablepanel exactly as it does on a chart: at least one action mixingfilter,drill,link,copy,export, andopenOverlay. - A
TableColumn.contextMenuadds actions to one column only; those actions render below the panel-level menu’s actions in the same popover, not in a separate menu. - Every action, whether bound at the panel level (
onClick,contextMenu) or the column level (contextMenu), still requireslabel, the text a reader sees before or during the click.
Panel-level onClick and contextMenu apply to a table panel the same as any other panel type; TableColumn.contextMenu is table-only, since no other panel type has columns.
Spec
View spec
{
"id": "reps-by-region-table",
"type": "table",
"title": "Reps by region",
"data": {
"rows": [
{
"region": "West",
"rep": "A. Chen",
"revenue": 410000
},
{
"region": "East",
"rep": "B. Ortiz",
"revenue": 390000
}
]
},
"spec": {
"columns": [
{
"field": "region",
"label": "Region"
},
{
"field": "rep",
"label": "Rep",
"contextMenu": {
"actions": [
{
"type": "copy",
"label": "Copy rep name",
"copy": "rep"
}
]
}
},
{
"field": "revenue",
"format": {
"type": "currency",
"currency": "USD",
"compact": true
},
"align": "right"
}
]
},
"onClick": {
"type": "filter",
"label": "Filter to {region}",
"param": "region",
"valueFrom": "region",
"valueType": "string"
},
"contextMenu": {
"actions": [
{
"type": "drill",
"label": "Drill into {region}",
"targetPage": "region-detail",
"param": "region",
"valueFrom": "region",
"valueType": "string"
},
{
"type": "export",
"label": "Export result (CSV)",
"format": "csv",
"scope": "result"
}
]
}
}onClick binds the whole clicked row and templates {region} into its label, the same as a chart’s onClick; the panel-level contextMenu adds a drill and an export action, and rep’s own contextMenu adds one more copy action that renders below them.
Try it live
Open the rich-tables template in the Builder
No bundled template wires a table onClick, so that half is read-the-block; right-click a row of p1-reps in the rich-tables template to see a table’s panel-level contextMenu live.
Build it in dvt
Every table capability on this site is a few lines of the same declarative JSON spec. Read the full spec format, or connect an AI agent to your warehouse and build one live in the quickstart.
Follow the build
dvt is in founding research. Leave your email and we'll reach out when there's something to see — no newsletters, no noise.