Creating Drop-Down Menu Options from Flow Output

Last Updated: 12/07/2015 Introduced in Verision: 2.0

In a form, drop-down menu options can be created from a number of sources – including flows. To create drop-down options from a flow, first create a flow that is configured to output the required information for the drop-down options. Then, in the Form Designer, create a form with a Drop Down List component that uses the flow as a List Input Source. Finally, create a flow that displays the form with the drop-down list.

Example

Our example flow will display a form containing a drop-down list and a button. In the drop-down list, users will be able to select from a list of all of the folders in our system. This drop-down list will be populated by a flow. We’ll create another flow to display our form.

We’ll begin our example by creating the flow which will retrieve a list of system folders. In our project folder, we will click the Create Flow button at the bottom of the window.

In the resulting New Flow pop-up, we will name our flow and click OK to open it in the Flow Designer.

We’ll begin designing our flow by placing the component that will get a list of all folders in our system. From the Flow Designer start-up window, under the Integrations > All Integrations > Internal Services > FolderService category, we will select a Get All component and click Add to add it to the workspace.

Next, we’ll connect our step outcomes.

To be useful as a source of input for the drop-down menu options, our flow must be configured to output the folder names it retrieved in Get All 1. To do this, we will select the End Step and, in the Properties panel, in the Output section, click the Add button.

Because our flow is outputting a list of folders, we’ll name our output “Folders” and declare its data type by clicking the Data Type selector to the right of the Type field.

In the resulting Select Entity pop-up, search Folder and select the data structure Folder and click OK.

Our flow is expected to output a list of folder objects, not just one, so we will check the Is List checkbox and click OK to save our output definition.

This completes our first flow, so we will click the Save Flow link at the top of the screen to save it, then close the Flow Designer.

Next, we’ll create the form which will display our drop-down list of folder names. We’ll begin in our project folder by clicking the Create Form button at the bottom of the window.

In the resulting New Form pop-up, we’ll name our form and click OK to open it in the Form Designer.

First, we’ll search for the Drop Down List component in the Toolbox panel, then drag it to the workspace.

Next, we’ll define the input which will populate our drop-down list. In the Properties panel, under the Input Data section, we will click the Type selector.

Search for Folder and select Folder in the resulting Select Entity pop-up, then click OK.

Each folder object possesses several properties – any one of which might be suitable to display in our drop-down list. To specify the folder name, in the Properties panel, in the Input Data section, we will select EntityName in the Display Field drop-down list. Change the List Input Source to Flow which will allow the drop down list to call a flow.

Identify your flow clicking on the selector within the Flow ID and connecting to the flow where the Get All step is located.

To be useful in subsequent steps, the drop-down list control must know what to call the item that is selected when the form is submitted. We’ll define this as “data” in the field Selected Item DataName.

Next, we’ll place a button on our form by dragging the Button component from the Toolbox panel to the workspace.

This completes our form, so we will select the Close Form link in the Form Designer menu at the top of the window and save the form as well.

Next, we’ll create our second and final flow. Back in our project folder, we will click the Create Flow button.

In the resulting New Flow popup, we will name our new flow and click OK to open it in the Flow Designer.

We will begin building our flow by selecting Drop Down Control Form. It can be found in the Flow Designer start-up window, under the category Flows, Rules, Forms and Reports > Forms[Interaction] > [Current Folder]. Click Add to add it to the workspace.

Next, we’ll connect our steps’ outcomes.

Save the flow by clicking the Save Flow link at the top of the Flow Designer.

Our flow is now ready to test. Back in our project folder, click the Drop Down Flow thumbnail and select Run Flow from its Action menu.

We are presented with our form.

When we enter letters in our drop-down list, the folder names containing that pattern automatically appear in a selectable list beneath our control. Alternately, we could click the arrow on the right side of our drop-down list to show all of the available folders.

Creating Drop-Down Menu Options from Flow Output

Example

Additional Resources