{"revision":"c10276e953456835cdbb1f3a60d58ae1980be353","document":{"id":2904,"path":"application-development/ui-builder/uib-ui-interaction-steps.md","title":"UI interaction toolbox steps","bundle":null,"doc_type":null,"release":"australia","body":"\n# UI interaction toolbox steps\n\nFind details about UI interaction toolbox steps, organized by interaction type, with step descriptions and any available outgoing events. Steps are added to a UI interaction using the toolbox in the UI interaction editor. The available steps depend on the type you selected when you created the UI interaction, whether Generic, Form, or List.\n\n## Available for all interaction types\n\nThe following steps are available regardless of whether your UI interaction type is Generic, Form, or List.\n\nSteps that show **None** in the Events column connect directly to the End node or the next step. They execute and do not return a confirmation that they have finished. To continue building the interaction after one of these steps, use an **And** branch.\n\nSteps that show **Success and/or Error** events allow you to define what happens next depending on the outcome, giving you full control over the interaction flow.\n\nWhen you insert a step before an existing step, the toolbox displays an Unavailable section. This section shows items that cannot be inserted at that location and includes a contextual message that changes depending on why the items are unavailable.\n\n\n
\n\nStep\n\n\n\nCategory\n\n\n\nDescription\n\n\n\nEvents\n\n
\n\nAdd alert notification\n\n\n\nAlert\n\n\n\nAdds an alert notification banner to the UI.\n\n\n\nAlert action selected\n\n
\n\nIf/Else\n\n\n\nLogic\n\n\n\nEvaluates conditions to branch the interaction flow. Branches evaluate top to bottom; the first true branch executes.\n\n\n\nNone\n\n
\n\nAnd\n\n\n\nLogic\n\n\n\nExecutes multiple branches in parallel \\(executes in order top to bottom\\). Use when activities should happen at the same time.\n\n\n\nNone\n\n
\n\nServer script\n\n\n\nScript\n\n\n\nExecutes a server-side script. Requires at least one user role.\n\n\n\nSuccess, Error\n\n
\n\nClose workspace tab\n\n\n\nNavigation\n\n\n\nCloses the current Workspace tab. Can optionally prompt the user before closing.\n\n\n\nNone\n\n
\n\nNavigate to record\n\n\n\nNavigation\n\n\n\nNavigates the user to a specific record page.\n\n\n\nNone\n\n
\n\nNavigate to route\n\n\n\nNavigation\n\n\n\nNavigates the user to a custom \\(non-record\\) route.\n\n\n\nNone\n\n
\n\nNavigate to URL\n\n\n\nNavigation\n\n\n\nNavigates the user to a URL, optionally in a new browser tab.\n\n\n\nNone\n\n
\n\nAlert\n\n\n\nModal\n\n\n\nDisplays a modal that notifies users without requiring further input.\n\n\n\nModal closed\n\n
\n\nConfirm\n\n\n\nModal\n\n\n\nDisplays a modal prompting the user to confirm or cancel an action.\n\n\n\nModal closed, Primary button clicked, Secondary button clicked\n\n
\n\nConfirm and destroy\n\n\n\nModal\n\n\n\nDisplays a modal for irreversible actions \\(such as deletion\\), with directive language and warnings.\n\n\n\nModal closed, Primary button clicked, Secondary button clicked\n\n
\n\nUser input\n\n\n\nModal\n\n\n\nDisplays a modal with fields for the user to complete. Fields can be added manually or sourced from a table.\n\n\n\nModal closed, Primary button clicked, Secondary button clicked\n\n
\n\nCreate modal\n\n\n\nModal\n\n\n\nOpens UI Builder component building to create a custom modal.\n\n\n\nModal closed; additional events can be defined by the custom component\n\n
\n\nForm\n\n\n\nModeless dialog\n\n\n\nDisplays a form inside a modeless dialog, allowing users to multi-task within their current context.\n\n\n\nModeless dialog closed, Primary button clicked, Secondary button clicked\n\n
\n\nCreate modeless dialog\n\n\n\n \n\n\n\nOpens UI Builder component building to create a custom modeless dialog.\n\n\n\nModeless dialog closed; additional events can be defined by the custom component\n\n
## Form interaction type only\n\nThe following steps are only available when the UI interaction type is set to Form. Form interactions require a form controller on the page and provide access to form-specific data and actions.\n\nField actions modify individual fields on the form. They do not produce success or error events; the step connects directly to the next step or end.\n\n|Step|Description|Events|\n|----|-----------|------|\n|Add field message|Adds a message below a specified field.|None|\n|Clear field message\\(s\\)|Clears messages from a specified field.|None|\n|Clear field messages by type|Clears all field messages of a given type. For example, all info messages.|None|\n|Clear field value|Clears the value of a specified field.|None|\n|Set field invalid|Sets a field to valid or invalid.|None|\n|Set field label|Updates the label of a specified field.|None|\n|Set field placeholder value|Sets the placeholder value of a specified field.|None|\n|Set field read-only|Sets a specified field to read-only.|None|\n|Set field required|Sets a field as required or optional.|None|\n|Set field value|Sets the value of a field. Can trigger or bypass dirty state.|None|\n|Set field visibility|Shows or hides a specified field.|None|\n\nForm actions operate on the form as a whole and include capabilities such as saving the form, validating the form, or displaying alerts.\n\n|Step|Description|Events|\n|----|-----------|------|\n|Add form alert|Displays an alert at the top of the form component.|None|\n|Clear all form alerts|Removes all alert notifications from the form.|None|\n|Clear form alerts by type|Removes form alert notifications of a specified type.|None|\n|Execute client script|Runs a client script on the form.|Success, Error|\n|Execute UI action|Executes a UI action, client and server side, that has been enabled for Configurable Workspace.|Success, Error|\n|Refresh form|Refreshes the form component.|Success|\n|Save|Saves the form.|Success|\n|Show/hide annotations|Shows or hides annotations on the form.|None|\n|Submit form using UI action|Submits the form using a specified UI action.|Success, Error|\n|Validate|Validates the form.|Success, Error|\n\n## List interaction type only\n\nThe following steps are only available when the UI interaction type is set to List. List interactions require a list controller on the page and provide access to list-specific data and actions.\n\n|Step|Description|Events|\n|----|-----------|------|\n|Execute client script|Runs a client script on the list.|Success, Error|\n|Group by column|Groups the list by a specified column.|None|\n|Refresh list|Refreshes the list component.|Success|\n|Set query|Updates the encoded query of the list.|None|\n|Sort|Sorts the list by a specified column, ascending or descending.|None|\n\n**Parent Topic:**[UI interactions](https://raw.githubusercontent.com/ServiceNow/ServiceNowDocs/australia/markdown/australia/application-development/ui-builder/uib-ui-interactions.md)\n\n"}}