Using Data Flow In a Form
- Updated on 13 Mar 2019
- 4 minutes to read
Having a Data Flow in a form allows a more personalized user interaction. A field on the form will change based off of what the user inputs. The flow within the form will run and have new data come back and populate on the form. The following example strictly shows the features of Data Flows in a Form and is not intended to simulate a business environment.
Create a Form where the user will input a long date (Month Day, Year) into the Text Box and the Data Flow will convert the long date to a short date format and appear in the Date Picker.
- Show Form: Favorite Steps
- Convert Text to Date: Flows > System Defaults > Converter Flows
Configure the Steps:
First, create a Flow that will house the Form. Create a new Designer Folder, once in the Designer Folder select Flow button.
In the Create Flow dialog click Default then Create. This will populate the Create Flow dialog to name the Flow , name the flow then select CREATE to proceed to the Flow Designer.
Select the Start step on the workspace which will bring up the Quick Add for Step dialog. In the Quick Add for Step dialog under the Favorite Steps tab, chose Show Form , then select ADD.
Once ADD is selected the Default Editor for Step dialog will appear. Name the Form, “Convert Text To Date”. Select Create.
The Form Designer will appear with a blank work space. To create the form this example calls for, under Favorite Components click and drag Button to the bottom right hand corner of the form.
Also click and drag Text Box to the form and name it “Long Date Format” simultaneously select (Shift+Enter) to add a Label above the Text box.
In the Form Controls panel, expand Data then click and drag Date Picker and simultaneously select (Shift+Enter) to add a Label above the Date Picker.
Select the White space of the the work space (the empty area outside of the form, white and grey checkered). In the Properties panel, navigate to the Form Rules tab. Under Data Flows select Add New.
An Add Data Flows dialog will appear. Name the Flow Data, “ConvertTextToDate”, under Flow select Create .
This will populate a Create New Flow dialog. Under Name, type “ConvertingDate” then select OK.
Now the Data Flow can be created. Navigate to the Steps panel, in the Search bar type Convert String. Click and drag Convert String to Date to the workspace. Connect the Done arrow from the Start step to Convert String to Date. Then connect the Done arrow from the Convert String to Date to the End step connect the steps.
Select the Start step to Edit Step. In the Edit Step dialog under Flow Input Data select Show Editor.
In the Data Definitions dialog, type “Long Date Format” under Name. Leave Type as String [Text]. Click CLOSE to exit out of the Data Definitions dialog, then select the X in the top left corner of the Edit Step dialog to return to workspace.
Select the Convert String to Date step in the workspace to have the Edit Step dialog appear. Under Inputs > String to Convert , change the Mapping Type to Select Value [From Flow]. Click Pick under the Path field.
The Pick Data dialog will appear, in the dialog select Long Date Format then at the bottom of the dialog select Pick. Notice under the Outputs tab the Mapping Type is already set to Rename and the Name is Converted Date.
Within Edit Step select [EndStep]. Under Data > Output select Show Editor.
In the Data Definitions dialog type “Short Date Format” under Name. Change Type to Date Time. Under Inputs > Short Date Format, click Select Value [From Flow] for the Mapping Type. Click Pick under the Path field. In the Pick Data dialog click on Converted Date then at the bottom of the dialog click Pick. Select CLOSE to exit out of the Data Definitions dialog, then select the X in the top left corner of the Edit Step dialog to return to work space.
Now select Close Flow in the top panel. The Save dialog will appear, click Save. The Flow Designer will close and Add Data Flows will appear again. Select Update Inputs to generate the Inputs and Outputs that were just created in the Flow Designer.
Once the Flow Inputs and Flow Outputs are updated, select the pencil icon in next to Long Date Format [String].
The Edit Flow Inputs dialog will appear. From the Input Type drop down menu select Form Component. From the Form Data Name chose Long Date Format. Unselect RunOnValueChanged. Select OK to exit from the Edit Flow Inputs dialog then select OK to exit from the Edit Data Flows dialog.
Back in the Form Designer select the Date Picker control, navigate to the properties panel. Under Data Name select Pick from Data Close Form to save and close the Form Designer. The original Flow that was named “TextToDate” will appear. Select Debug on the top panel.
The Debugger will appear, select the Run button in the middle of the screen to initiate the Debugger.
The Run Form dialog allows you to enter a Long Date Format and the Short Date Format will populate as you exit the Text Box. Once the project is debugged click the Exit button and click the Close Form button back in the Flow Designer to save and close the Flow.