[TIPS] Add "Other" to PowerApps Canvas App Dropdown Field

 Dropdown menus allow app users to select a pre-defined value from a list of options. But sometimes you want the user to fill-in their own value using a text input their selection cannot be found in the list. In this article I will show you how to create a dropdown with an other option in Power Apps.

To add an ‘Other’ option change the Items property of the dropdown to this code.

Ungroup(
     Table(
         {DropdownOptions: Choices([@'Resource Requirement Tracker'].Role)},
         {DropdownOptions: ["Other"]}
     ),
     "DropdownOptions"
 )

Now when we click on the dropdown an ‘Other’ option is included at the bottom.

Allow A Fill-in Option With A Text Input

When an employee selects ‘Other’ from the dropdown a text input should appear where a custom value can be filled-in. Create a text input called txtin_Role and place it directly over top of the dropdown field dd_Role.

The text input should only be visible when the dropdown is not. Put this code in the Visible property of txtin_Role.

Not(dd_Role.Visible)

Likewise, the dropdown should only be visible when the selected value does not equal ‘Other’. Use this code in the Visible property of dd_Role.

Self.Selected.Value<>"Other"

Test the feature we just created by selecting ‘Other’ from the dropdown. Make sure it behaves just like the image below.

Next, we will create a way to return to the dropdown if they no longer want to use a custom value. Insert a cancel icon called icn_CancelOtherRole on the right side of the text input.

Clicking the button will reset both the dropdown and the text input to show blank values. Write this code in the OnSelect property of the icon.

Reset(dd_Role); 
Reset(txtin_Role);

The icon must only appear when the text input is also showing. 

txtin_Role.Visible

Pressing the icon will now reset the role field.

Saving The Custom Value To SharePoint

Some additional code is needed to tell Power Apps which value to update the SharePoint list with. Highlight the Role card in the Edit Form and write this code in the Update property.

If(dd_Role.Selected.Value = "Other", 
{Value : txtin_Role.Text},
dd_Role.Selected)

Done.