Using Data Grid Selection in Data FlowLast Updated: 03/28/2018 Introduced in Version: 4.0
This tutorial demonstrates how to dynamically change data on the Form with a simple Data Flow. Data Flows in Decisions are type of “Helper Flows” that may be triggered by some Form events and change data on the Form.
In this example we are going to create a simple Flow with a Form on it. The Form will have Data Grid component displaying all Accounts in the System. When User changes selection on the Data Grid component we are going to trigger a Data Flow that will be using selected Data Grid row and outputting selected Account’s Email Address on the Form.
We begin in the Designer Folder with clicking Create New Flow icon on Start Folder View.
Then, we Name the Flow and click Ok to proceed to the Flow Designer.
As mentioned before, our Flow will have a Form with Data Grid displaying all Accounts in the System. First, we are going to need to get All Accounts to be available in the Flow. We add Get All step from Integrations > All Integrations > Internal Services > Accounts Service category.
On the Get All step outcome we add Show Form step from Favorite Steps category.
In the resulting window we Name the Form and click Create to proceed to the Form Designer.
In the Form Designer we add Label component that reflects Form title and Button component for User to be able to submit this Form. Then, we add Data Grid component from Data > Data Grid category in the ToolBox.
For the Data Grid component we locate Input Settings. In the Input Settings we define Data Name and Pick Account Type.
Then, in Column Information Settings we keep desirable Columns from Account type and delete unnecessary. Next, we locate Output Data Settings and define Grid Mode as SingleSelect. Also, we provide with Data Name our Selected row.
Next, we are going to create our Data Flow. We click outside of our Form’s work-space to switch to the Form’s global settings. Then, we locate Data Flows in the Form Rules section and click Add New.
In the Add Data Flows window we Name our Flow Data and click Create under Flow Settings.
In the resulting window we Name our Data Flow and click Ok to proceed to the Flow Designer.
In the Flow Designer we select Start Step and in the Flow Data settings we click Add New Flow Input Data.
In the Add Flow Input Data window we Name our Input Data and pick Account Type. Then, click CLOSE to save and continue.
Our Flow Input Data is defined and we can click Ok to close this window and continue.
Then, we connect Start Step and End Step on the work-space, select End Step, and click Add New Data in the Output settings for the End Step.
In the resulting Add Data window we provide Output data name in General Information settings, and pick String Data type in Type Information settings. Then, we click Ok to save and close Add Data window.
Back in the Edit End Step window we locate Inputs settings, pick Select Value Mapping Type, and using Path Picker select Email Address field from our Account Flow Input Data that we defined on the Start Step in our Flow.
This completes our Data Flow. We can save the Flow and close Flow Designer.
Back in the Add Data Flows window we click Update Inputs under Flow Inputs box.
selectedAccount Flow Input shows up. We select it and click Edit.
In the Edit Flow Inputs window we pick Form Component Input Type and from the Form Data Name drop-down we pick selectedAccount (this is our Data Grid selected Data Name).
Note: if we pick Form Component Input Type, in the Form Data Name drop-down we will only see Form Components that match our Data Flow Input. In this Example, because our Data Grid displays a collection of Accounts, single row represents one Account; this matches our Data Flow Input that requires single Account Input Data.
When finished, we click Ok to save and close this window.
Then, we pick Dynamic DataGrid: Selection Changed as a Trigger in Advanced settings for our Data Flow. Click Ok to save and close Data Flow definition window.
Finally, we are going to add a dynamic Label to our Form to reflect selected Account’s Email Address. We add Label Component to our Form. Then, in Common Properties for the Label we check Text from Data Name check-box and using Pick From Data link select Flow: selected Account Email Address outcome from our Data Flow.
This completes our Form Design. We can save the Form and close Form Designer.
Back in the Main Flow Designer we Select Value of the Get All_Output for the Accounts Input to our Form.
Then, we connect the outcome from our Form Step to the End Step in our Flow. This completes our Main Flow. We can save the Flow and close Flow Designer.
In the Designer Folder we locate a thumbnail for our Main Flow and click Action > Run Flow on thumbnail’s menu.
Our Form pops up… Data Grid component populated with all Accounts in the System. Because first row is selected by default, Label displays ‘firstname.lastname@example.org’ selected Account Email Address.
If we change our selection on the Data Grid component, our Data Flow triggers and changes Label text to reflect selected Account Email Address.