Drop Down control is a list of items which are originating from an Data source or we can also hard-code the items to be displayed on the control in the function bar
It can only display a single item or choice at once that too the first item in the list, Until the user selects a particular item from the Chevron to reveal more options. When the list contains a large number of choice values then the drop down control will appears a maximum of 500 items or choice values at once.
On the Power Apps studio , Go to the Insert tab -> Select Input -> Click on Drop down as shown below.
Properties :- Drop down has many properties by using which we are performing different actions on a drop down.
Drop down properties are shown on the left navigation pane and also the Display properties of the drop down will be shown on the right navigation bar.
Advanced properties :-
Items property will display the items of the data source, when the Data source has multiple columns we need to set the control’s property to particular column of data source to display it on the control.
students : Data source
Title : Data source column
Default By default It will display an initial value of the control before the user specifies a value.
Value The column of the data that you want to show in the control (when source has multiple columns)
Allow Empty Selection It defines whether the control shows an Empty selection if no item has been selected, users can also clear their choices by selecting blank item.
it will allow to select empty value in the drop down.
Onchange It represents the actions to perform when the user changes the value of a control
Onselect It represents the actions to perform when the user taps or clicks a control
Reset whether a control reverts to its default value.
Tooltip Explanatory text that appears when the user hovers over a control.
I have added a text in the Tooltip property of the drop down
When i preview the app and hovers on the drop down the text will appear as shown below
Visible Whether a control appears or is hidden. It will only take boolean values (true/false).
visible = true
visible = false
Width The distance between a control’s left and right edges.
X The distance between the left edge of a control and the left edge of its parent container (screen if no parent container).
Here the parent container is the screen so it will measure the distance between screen and drop down i.e the X axis.
Y The distance between the top edge of a control and the top edge of the parent container (screen if no parent container).
It will measure the distance between screen and drop down on the top side i.e Y axis
Display Mode It defines whether the control allows user input (Edit), only displays data (View), or is disabled (Disabled).
Add items to a drop down Manually
While adding the values into the drop down control, you must ensure to put the values within the [ ] bracket
Add a Drop down control, and then set its items property to this expression:
Strings
| [“one”,”Two”,”Three”,”four”,”five”,”six”,”seven”] |
The preview of the App will be shown below
Numbers
| [1 , 2, 3, 4, 5, 6, 7] |
Add items To drop down from Data source
Connect The SharePoint with Power apps As a data source
Here i have connected a “students” list to power apps .
The list contains different columns but i need to display “Title” column items on the drop down control, For that we need to set the Column name to the items property.
set its items property to this expression:
| Students.Title |
students :- List name
Title :- One of the column in the list
By default it will display the first item of the column until user selects an item. Only one item will be displayed at once in a drop down.
Choice column while dealing with choice column make sure that the items property has to be changed as below
set its items property to this expression:
| choices (students . Region |
Region :- Is a single select choice column of the list where the choices are south, north, west and east.
Make sure that your choice column is a single select choice column instead of multi select choice column.
Drop down with multiple columns from same SharePoint List
To display more than one column information in the drop down we can use “Concatenate ” function.
set its items property to this expression:
Concatenate(
students.Title,
" - ",
students.
)
The Result will be shown below where the two columns items are combined with “:” symbol
Not only with single SharePoint list but we can also use Different SharePoint list columns at a time to display the items on Drop Down