Incrementally Searching through Flow Output

The Drop Down List form component also functions as an incremental search box, allowing incremental search against any input. To create an incremental search box, place a form containing the Drop Down List form component within your flow and define the List Input Source (typically, another flow).

Example:

Our example flow will use a drop-down list to provide incremental search of the folders present in our system. The input for this drop-down list will be a flow that gets all of our system’s folders, called Get all folder Flow.

Our example assumes that Get all folder Flow has already been created.

We’ll begin in our project folder “Designer Folder” by clicking the Create Form button.

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

First, we will drag a Drop Down List component from the Toolbox panel to the workspace.

 

Next, we’ll drag a Button component from the Toolbox panel to the workspace. It can be found under the Actions category.

We will begin configuring our drop-down list by setting the type of data it will be expected to display. In the Properties panel, under the section Input Data, we will click the Type selector.

In the resulting Select Entity pop-up, we will search for Folder and select the Folder entity and click OK.

Because our list’s options will be based on Get all folder Flow, we will set the List Input Source value to Flow.

Because we want our list to display each folder’s name, we will set the Display Field value to EntityName.

Next, we will define the specific flow to be used to populate our drop-down list by clicking the Flow ID selector.

In the resulting Select Pick Flow pop-up, we will select Get all folder Flow and click OK.

We will also check the Output only checkbox, under the section Output Data, in order to prevent the component from accepting input.

This completes our form design, so we will click the Save Form link at the top of the Form Designer.

Back in our project folder, we will begin creating our example flow by clicking the Create Flow button at the bottom of the window.

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

Next, we will connect the outcomes of our flow. We will connect the Start Step‘s Done outcome to [Form] Drop Down Form, and we will connect [Form] Drop Down Form‘s Button outcome to the End Step.

This completes our flow design, so we will click the Save Flow link at the top of the window, and then close the Flow Designer.

The resulting pop-up displays Drop Down Form.

For every letter we enter into the drop-down list, a summary list of the options in the drop-down list which contain that exact pattern is displayed. For example, inputting the letter “f”, creates a summary list of all the folders containing the letter “f”.

Inputting the letters “fo”, creates a summary list of the folders containing the letters ” fo”, next to each other.

And so on, until we’ve narrowed our list down to the only folders containing the word “folder” in their names.

Additional Resources

• Creating Drop-Down Menu Options from Flow Output
• Creating Your First Form Flow
• Creating Your First Form
• Creating Dependent Drop-Down Menu Options