Using a Database to Populate Auto-Complete Search ComponentLast Updated: 07/15/2016 Introduced in Verision: 2.0 |
The AutoComplete Search component in a form lets a user enter characters and produces a list of values that match those characters, beginning with a partial match. The data type for the AutoComplete Search component is a string list.
This example uses data from the Northwind database to populate a AutoComplete Search component. The database integration is already complete. (To see these steps, please go to the topic Integrating an External Database).
We begin in the Designer Folder with adding a database table we will work with. Click Datatypes/Database > Database Integration > Add Table on the Folder Actions Panel.
In the resulting pop-up table we use Select existing connection option and pick Northwind database from Existing Connections. Then, click Next.
Then, we pick a desirable table from Table Name dropdown list.
When table is chosen, we can pick desirable Table Fields, Primary Keys and Steps to Generate. Click Ok to create an integration to the Table.
System creates a Table Definition in our Designer Folder.
To use this Table Definition in the Flow, we click Create Flow button on the Folder Actions Panel.
In the resulting window we Name the Flow and click Create to proceed to the Flow Designer.
The first component in the flow will be the database component that retrieves the data for the AutoComplete Search component. Expand the Integrations > My Integrations > Database category from the Flow Designer’s start-up window. Select the Get all component for the data set and click Add to add it to the workspace.
Connect the Failed path from the Get All step to the End step.
On the Done outcome from our Get All step we add Show Form step from the Favorite Steps category.
Then, we Name our Form and click Create to proceed to the Form Designer.
Our Form designed as following… It has a Button control from Actions category in the ToolBox and AutoComplete Search component. Save and close Form Designer when finished.
Back in the Flow Designer we select our Get All step on the workspace and Ignore Limit Count input.
Lastly, map the output from the Get All step to the input for the AutoComplete Search component on the form. Connect the Done path from the Get All step to the form, and connect the outcome from the form to the End step. Click on the form, and under Inputs, map as follows:
This completes our Flow. We can click Debug Flow link on the Top panel of the Flow Designer to test it.
Note that in Decisions version 3.5 and above, you’ll need to click on Test Flow to access the Debugger.
Now, when the flow runs, data from the Get All component populates the AutoComplete Search box.
