How To Bind Power Apps Text Input Values To a Dropdown Control

Power Apps is a flexible tool that enables users to develop custom applications without requiring in-depth coding expertise.

In this Power Apps tutorial, I will show you how to bind Power Apps text input values to a dropdown control with two scenarios:

  1. Bind the single line text input values to dropdown items in Power Apps.
  2. Power Apps bind multiline text input to dropdown items.

How to bind Power Apps text input values to a dropdown control

In this section, I will show you how to bind text input values to a dropdown control in Power Apps with two different examples:

Bind single line text input values to dropdown items in Power Apps

In this example, you will learn how to bind the single line text input values to dropdown items.

I have created a Power Apps Canvas app and then added a text-input control, a Button control, and a Dropdown control.

When the user provides the values in a text input control and clicks on the button control, those values will be added to a Power Apps dropdown control as shown below:

Bind text input values to dropdown control in Power Apps

Let me show you how to achieve this:

  • On the Power Apps screen, insert a Text input control as shown below:
How to bind text input values to a Power Apps dropdown control
  • Now, insert the Button control -> Set its OnSelect property to:
Collect(
    DepartmentCollection,
    Split(
        txt_Department.Text,
        Char(10)
    )
);
Reset(txt_Department);

Where,

  1. DepartmentCollection = Provide the collection name
  2. txt_Department = The text input control name
Bind single line text input values to dropdown items in Power Apps
  • On the Screen OnVisible property, provide the code as:
ClearCollect(DepartmentCollection, [])

Where,

  1. DepartmentCollection = Provide the collection name.
How to bind single line text input values to dropdown in Power Apps
  • To add the values to the dropdown, insert a Dropdown control -> Set its Items property to:
DepartmentCollection.Value

Where,

  1. DepartmentCollection = Collection name
How to bind Power Apps text input values to a dropdown
  • Once your app is ready, Save, Publish, and Preview the app. When the user provides a value in the text-input control and clicks on a button control. Those values will be keep on adding to a dropdown control as shown below:

As per the above image, we can see that the dropdown contains duplicate values.

After a user enters a text-input value and clicks on a button control, the dropdown should avoid adding any identical values to its existing items, as shown below:

How to bind Power Apps dropdown values from text input

So to remove those duplicate values and the dropdown should avoid taking similar values, then follow the below step:

  • Select the Power Apps dropdown control -> Set its Items property to:
Distinct(DepartmentCollection,Value)
Bind text input values to a Power Apps dropdown control
  • Save, Publish, and Preview the app, when the user provides the same value in the text-input control and clicks on a button control. The values will not be taken to a dropdown items as shown below:
How to bind text input values to dropdown control in  Power Apps

This is how to bind a single line text input values to a dropdown in Power Apps.

Power Apps bind multiline text input to dropdown items

Let us see, how to add multiline text input values to dropdown items in Power Apps.

For Example, I have created a Power Apps Canvas app and then added a text input control, a Button control, and a Dropdown control.

When the user provides the values in a text-input control and clicks on the button control, those values will be added to a Power Apps dropdown control as shown below:

Power Apps bind text input to the dropdown items

Follow the below steps to achieve this:

  • On the Power Apps screen, insert a Text-input control -> In the text-input control properties pane, change the mode to Multiline.
Bind multiline text input to dropdown items in Power Apps
  • Insert a Button control -> Set its OnSelect property to:
UpdateContext(
    {
        Status: Split(
            txt_Status.Text,
            Char(10)
        )
    }
)

Where,

  1. Status = Variable name
  2. txt_Status = Text input control name
How to bind multiline text input to dropdown items in Power Apps
  • Insert a Dropdown control -> Set its Items property to:
Status

Where,

  1. Status = Variable name
Bind Power Apps text input values to a dropdown control
  • Save, Publish, and Preview the app when the user provides a value in the text-input control and clicks on a button control. The values will be populated in a dropdown control as shown below:
Power Apps bind multiline text input to dropdown items

This is how to add multiline text input values to dropdown items in Power Apps.

Conclusion

By following our Power Apps tutorial, you should be able to successfully implement Power Apps bind text-input values to a dropdown control with two scenarios:

  1. How to bind the single line text input values to dropdown items in Power Apps.
  2. Power Apps bind multiline text input to dropdown items.

You may like the following tutorials: