Show hide fields based on dropdown selection PowerApps

In this Power Apps Tutorial, we will discuss how to show hide fields based on dropdown selection PowerApps.

Show hide fields based on dropdown selection PowerApps

I have a SharePoint Online List named “Access Registers“. This list has some columns with different data types. Among all these types of columns, It has a Department column with a Choice data type.

Also, this SharePoint list has these below columns that I am going to use in this example as:

  • Employee Name (Person Data type)
  • Visitors Name (Single line of text)
  • Visitors Contact Number (Single line of text)

In the below screenshot, you can see all the different types of columns that are present in the SharePoint List (Access Registers).

show hide fields based on dropdown selection powerapps

In this example what I am going to do is,

In the Department column, I have some choice options like IT, HR, FINANCE, ADMIN, MARKETING, PURCHASING, VISITORS, etc.

Based upon these choice options, I want to show or hide the Employee Name, Visitors Name, and Visitors Contact Number in a Power Apps Edit form.

When a user will select the Department value as Visitors, then the user can see only the Visitors Name and Visitors Contact Number. At the same time, the Employee Name column should be hidden.

Similarly, When a user will select the Department value as IT, FINANCE, HR, etc, then the user can only see the Employee Name. At the same time, the Visitors Name and Visitors Contact Number column should be hidden.

PowerApps show hide fields

I have created a Canvas Powerapps app where I have used these four fields (Department, Employee Name, Visitors Name, Visitors Contact Number) in an Edit Form.

The Powerapps Edit form looks like the below screenshot:

show hide fields based on dropdown selection powerapps
show hide fields based on dropdown selection powerapps

In this above screenshot, if you will choose the Department as Visitors, then only you will be able to see the Visitors Name and Visitors Contact Number. Rest of the time, you will see only the Employee Name.

Follow these below things to show or hide the data card:

  • If you want to show the Employee Name field Data card, then select the Data card (Employee Name) and apply the below formula on its Visible property as:
Visible = If(DataCardValue3.Selected.Value="VISITORS",false,true)

Where,

DataCardValue3.Selected.Value = Department Dropdown data card value name

The above formula specifies, If the Department Dropdown Data card value is “VISITORS“, then the Employee Name field will be hidden otherwise it will visible.

You can see the below screenshot for your reference:

Power Apps Show or Hide Data card based on dropdown Selection
powerapps show hide fields
  • Similarly, If you want to display the Visitors Name and Visitors Contact Number Data card, then select the Data card (Visitors Name) and apply the below formula on its Visible property as:
Visible = If(DataCardValue3.Selected.Value="VISITORS",true,false)

Where,

DataCardValue3.Selected.Value = Department Dropdown data card value name

The above formula specifies, If the Department Dropdown Data card value is “VISITORS“, then the Vistors Name field will be displayed otherwise it will be hidden.

PowerApps Show or Hide Data card based on dropdown Selection
PowerApps show hide fields based on dropdown selection
  • Like the previous one (Visitors Name), the same thing, and the same formula you can apply for the Visitors Contact Number Data Card. Just select the data card (Visitors Contact Number) and apply the formula on its Visible property.

Preview the Powerapps app:

Just Save and Preview (F5) the Powerapps app. Select the Department value as “IT”, “FINANCE” or “HR” from the dropdown control.

Once you will select any department value (Except VISITORS), then you can see the “Employee Name” field as shown in the below screenshot.

PowerApps show hide fields based on dropdown selection
PowerApps show hide fields based on dropdown selection

Similarly, Select the Department value as “VISITORS“. At the same time, you can see the “Visitors Name” and “Visitors Contact Number” fields as the below screenshot.

powerapps show hide fields
powerapps show hide fields

Also, you may like these below Power Apps Tutorials:

In this tutorial, we learned how to show hide fields based on dropdown selection PowerApps.

>