Watch the walkthrough
Create a reusable project card, define component inputs and actions, and reuse it in a responsive project overview. Save and test component events and state.
Watch tutorial (12:17)
Attach actions to elements so a page responds to user interactions.
Recorded with an earlier Twidget interface. Names, control locations and available options may differ; use the linked documentation for current guidance.
Watch tutorial (2:16)
Connect forms and a table to task endpoints, then test create, update, delete, validation and error recovery.
Watch tutorial (20:27)Browse all video tutorials
Element actions in Twidget are integral commands that can be assigned to user interface elements, enabling interactivity within applications. The actions are defined to respond to user inputs, primarily through triggering events associated with specific elements.
Purpose of Element Actions
Element actions allow developers to enhance user experience by enabling dynamic interactions, such as responding to clicks, updating variables, controlling layouts, and executing functions. This functionality is central to building interactive applications without needing to write extensive code.
Key Concepts
Action Assignment: Actions can be added to most elements through an intuitive user interface, where developers can access an element's toolbar and navigate to the actions section.
Trigger Mechanism: Each action can be triggered by specific user events (e.g., clicks, changes). Some actions are limited to a single type of trigger, while others can support multiple triggers depending on the element type.
Action Types: Various action types are available, including:
Run Function: Executes a predefined or custom function.
Control Layout: Manages visibility and state of UI layouts (open, close, toggle).
Update Variable: Changes the values of page variables dynamically.
Go to URL: Redirects users to specified URLs, with options for how the destination page loads.
Conditional Execution: Developers can define conditions under which actions may execute using the "run when" clause, ensuring actions only run if certain logical conditions are met.
Main Components and Workflow
The workflow begins with defining and adding actions to elements. After selecting an element and accessing the action options, developers can specify desired actions and their related triggers. The actions can be customized as needed, allowing for flexibility in how the application should respond to user interactions.
In summary, the element actions in Twidget serve as the driving force for application interactivity, providing a versatile framework for defining user interactions within a no-code environment.
