Controlling Form Fields with Visibility Rules
- 19 Jul 2022
- 2 Minutes to read
- Print
- DarkLight
This documentation version is deprecated, please click here for the latest version.
Controlling Form Fields with Visibility Rules
- Updated on 19 Jul 2022
- 2 Minutes to read
- Print
- DarkLight
Article summary
Did you find this summary helpful?
Thank you for your feedback
Overview
On a Form, Decisions has Visibility Rules to control if a Form component is shown/hidden and enabled/disabled depending on what is input by the end-user.
Hide/Show Visibility Rule
- In a Designer Folder, select the CREATE FLOW button.
- When the Create Flow dialog appears, select Flow, name the Flow, then select CREATE.
- Select the Done outcome path of the Start step.
- In the Add After dialog, select the Show Form step in the Favorite Steps category. Select ADD.
- With the Show Form step selected, in the Properties panel, select Pick or Create Form.
- Select CREATE under Create New. Name the Form. Select CREATE.
- In the Form Designer, add a Check Box (Shipping Address Same As Billing), a Text Box (Address), and a Button (Submit Purchase).
- Select the workspace, then navigate to the Properties panel. Under Form Rules > Visibility Rules, select Add New.
- In the Add Visibility Rules dialog, name the Rule, and under Rule select Pick.
- In the Pick Entity dialog, navigate to All > System > Designers > Catalog > System Defaults > Default Form Validation Rules choose Value is True, select PICK.
- In the Add Visibility Rules dialog, select Update Inputs.
- Within the Rule Inputs box, choose the input and select Edit [pencil shaped icon].
- In the Edit Rule Inputs dialog, from the Input Type drop down list, select Form Component.
- To indicate which field on the Form that the Visibility Rule will be Triggered By, select "Shiping Address Same As Billing" from the Form Data Name drop down list. Click OK.
- In the Edit Visibility Rules dialog, in the Behavior drop down list, select Hide/Show.
- Change the Evaluation to Hide if rule Evaluates as TRUE.
- Under Triggers, select "Shipping Address Same as Billing [CheckBox] : Value Changed".
- Finally, under Apply to Controls, select the control to hide, "Address [TextBox]". Click OK.
- Save and close the Form Designer.
Debug: Hide/Show
- In the Flow Designer, connect the Show Form step to the End step.
- Set all Form inputs to an Ignore input mapping.
- Select Debug in the top action panel.
- In the Debugger, set the boolean to True and False to Show/Hide the Address Text Box.
Disable/Enable Visibility Rule
- Edit the Form created in the first example. Add a Date Time Picker (DoB) and a Label (Date of Birth).
- In the Properties panel, under Form Rules > Visibility Rules, select Add New.
- In the Add Visibility Rules dialog, name the Rule, and under Rule select Create.
- In the Create New Rule dialog, name the Rule and click CREATE.
- In the Rule Designer, select SETUP INPUT DATA.
- In the Data Definitions dialog, Name the input "DoB" and set the Type to Date Time. Click CLOSE.
- Set the Rule to read: If the DoB is After 7665 Days (in Past), then Return True. For this example, it is assumed that 21 years = 7,665 days.
- Save and close the Rule Designer.To learn more about building rules, navigate to the Create a Rule article.
- Back in the Add Visibility Rules dialog, select Update Inputs.
- Within the Rule Inputs box, choose the input and select Edit [pencil shaped icon].
- In the Edit Rule Inputs dialog, from the Input Type drop down list, select Form Component.
- To indicate which field on the Form that the Visibility Rule will be triggered by, select "DoB" from the Form Data Name drop down list. Click OK.
- Back in the Edit Visibility Rules dialog, in the Behavior drop down list, select Enable/Disable.
- Change the Evaluation to Disable if rule Evaluates as TRUE.
- Under Triggers, select DateTime Picker: Value Changed.
- Finally, under Apply to Controls, select the control to disable: Button. Select OK.
- Save and close the Form Designer.
Debug: Disable/Enable
- In the Flow Designer, set the new input to an Ignore input mapping.
- Select Debug from the top action panel.
- Select START DEBUGGING.
- Set the DoB Date Picker to be older than 21 years and younger than 21 years to disable/enable the Submit Purchase Button.
Was this article helpful?