Action System Overview
Actions are configured responses to widget events. No code required — connect button clicks, form submits, and row selections to navigation, workflows, and variable changes through the Properties Editor.
Event → Action Pattern
Every interactive widget emits events. Each event can have one or more actions configured. The App Studio Action Executor runs those actions when the event fires at runtime.
Widget Emits Event
User clicks a Button, submits a Form, or selects a DataGrid row. The widget fires its event (e.g., onClick).
Action Executor Picks Up
The Action Executor looks up the configured action(s) for that widget's event. It resolves any token expressions in the action config using the current app state.
Action Executes
The action runs — navigating to a page, triggering a workflow, opening a modal, or setting a variable. If multiple actions are chained, they run in sequence.
Available Action Types
| Type | What It Does | Key Config |
|---|---|---|
navigate | Navigate to an AppPage (internal) or external URL | target, params, replace |
submit-form | Submit a Form Widget, then handle success/error | formWidgetId, onSuccess, onError |
trigger-workflow | Start a Flow Studio workflow with input variables | processId, input, onComplete |
open-modal | Show a modal Pane as an overlay | paneId, closeOnBackdrop |
set-variable | Set an app variable to a value or expression | variable, value |
chain | Run multiple actions in sequence | actions[] (ordered array) |
conditional | Run action only when expression is truthy | condition, then, else |
Widget Events Reference
| Event | Widgets That Emit It |
|---|---|
onClick | Button, Image, Text (when clickable: true) |
onSubmit | Form widget (after successful validation) |
onValidationError | Form widget (failed validation) |
onRowSelect | DataGrid (row click, when selectable: true) |
onRowDblClick | DataGrid (row double-click) |
onChange | TextInput, Dropdown, Toggle, DatePicker |
onMount | Any widget — fires when the widget loads on the current page |
onEventClick | Calendar widget |
When a DataGrid onRowSelect action fires, the selected row's data is available as {{ row.fieldName }} in the action config. For example, target: "/leads/{{ row.id }}" navigates to the detail page for the clicked row.