Form Components Visibility Using Flow DataLast Updated: 07/27/2016 Introduced in Verision: 2.0 |
In Decisions 3.2.0 Form components visibility can be controlled with Flow Data. By configuring Initially Visible Source option in Behavior settings to be From Flow Data we can decide if we want to display this component or not with the Boolean Variable sent from the Flow.
Example:
In this example we will create a Flow with two Forms. On the First Form user will be able to decide if he or she wants to display an input on the Next Form.
We begin in the Designer Folder by clicking Create Flow button on the Folder Actions Panel.
Next, we Name our Flow and click Create to proceed to the Flow Designer.
In the Flow Designer we add Show Form component from the Favorite Steps category.
In the resulting window we Name our Form and click Create to proceed to the Form Designer.
This Form is designed as following… It has a TextBox where the user can input his or her Email Address, and it has a CheckBox that represents user’s decision about displaying his or her Email Address on the next Form. CheckBox component outputs Boolean data type which can be used for Form Component Visibility on the Next Form. When finished designing this Form, we can save it and close Form Designer.
Back in the Flow Designer we add another Form using Show Form component from the Favorite Steps category.
Next, we Name our second Form and click Create.
First, we add two buttons on the Form. One button will close the Form and terminate the Flow execution and another button will navigate the user to the previous Form. Then, we add Label component from the Data category in the ToolBox.
We want the visibility of this Label to be controlled from the Flow. Therefore, we locate Label’s configurations and in the Behavior section we change Initially Visible Source from Constant Value to From Flow Data.
Next, in the Initially Visible Data we type desirable Name to control this Label’s visibility.
Then, we need to add a Label that will display user’s input from the previous Form. In this case we expand Flow Data category in the ToolBox, and use [create] label (value) component from Email sub category. Again, we configure Behavior for this Label in the similar manner we did it for the first Label on this Form. And, this completes our Display Form design. We save the Form and close Form Designer.
Back in the Flow Designer we connect steps in our Flow in the following manner. Next, we select our second Form step on the workspace and Step Information Layer pops up. We select Show Mapping Editor option for this step.
In the Mapping Editor we connect the output from the CheckBox in the First Form to the Label Behavior controls on the Second Form. Click Ok to save and close Mapping Editor.
This completes our Flow. To test it we can click Debug Flow link on the top panel of the Flow Designer.
Note that in Decisions version 3.5 and above, you’ll need to click Test Flow to access this function.
First Form opens in the Debugger… We fill in the TextBox with our Email Address, leave the CheckBox unchecked, and click Done to proceed to the next Form.
Second Form opens and our Labels are not visible. We click the Back button.
First Form opens again. This time we fill in our Email Address and check the CheckBox. Then, we click Done to observe the results on the Second Form.
Second Form opens and our Labels are visible this time as designed. We click Done to terminate Flow execution.
The Diagram in the Debugger confirms that the Flow ran to the End without errors.
