PowerApps Gallery Control Filter Example

In this PowerApps Tutorial, We will discuss what is Gallery control in PowerApps and what are the properties that present in the PowerApps Gallery control and PowerApps gallery control filter example.

Also, By taking some simple scenarios, We will see how to use the PowerApps Gallery control in PowerApps Screen. Below are some PowerApps Gallery Control topics that we will cover in this tutorial as:

  • PowerApps Gallery SharePoint List
  • PowerApps Gallery Control Filter or How to filter items in PowerApps Gallery control
  • What is the PowerApps Gallery Table
  • PowerApps Gallery Template Size
  • What do you mean by PowerApps Image Gallery Control
  • How to set Gallery Selected Item in PowerApps
  • PowerApps Filter Gallery By Current User Sharepoint 500 Record Limitation
  • PowerApps Filter Gallery by Dropdown
  • PowerApps Filter Gallery by Text input
  • PowerApps Filter Gallery by Date Range
  • PowerApps Filter Gallery by multiple Dropdown
  • PowerApps Filter Gallery by Date
  • PowerApps Filter Gallery by Combobox

PowerApps Gallery Control

  • First of all, we need to know what is a Gallery control and then What does the mean of PowerApps Gallery control.
  • A Gallery control contains a set of data and other controls in it. A PowerApps Gallery control means the gallery control that is present in the PowerApps app.
  • PowerApps Gallery Control can display the number of records from a Data source (maybe from SharePoint list, Excel, etc) and each record can contain multiple types of data.
  • For example, We can use the PowerApps Gallery control to display the detailed information about an employee like Employee Name, Employee ID, Employee Email, Employee profile picture, Employee Contact number, Employee Address, etc. You can show all these things in a Gallery control in PowerApps.
  • Within the Gallery control, Each data field appears in a separate control. You can configure those controls in its template. The template appears as:
  1. On the left edge of a Gallery control in horizontal/landscape orientation.
  2. And at the top of a Gallery control in vertical/portrait orientation.
  • If you will make any changes in the template, then it will reflect the whole Gallery control.
  • There are six different types of PowerApps Gallery Control available. Such as:
  1. Vertical
  2. Horizontal
  3. Flexible height
  4. Blank vertical
  5. Blank horizontal
  6. Blank flexible height

NOTE:

There is a limitation in PowerApps while a user using the Flexible height gallery control. If the user scrolls this gallery control before loading all the items, then the item that’s currently in view may be pushed down and out of view at the time of data loading is finished.
To resolve this type of issue, instead of using the Flexible height gallery control, you can use a standard Gallery control in PowerApps.

PowerApps Gallery Control Properties

Below represents some important PowerApps Gallery control properties as:

  • Default: When the app starts up, the record from the data source to be selected in the gallery.
  • Items: The data source that appears in control such a list, a chart, or a gallery.
  • Selected: It is the property that helps to display the selected item.
  • AccessibleLabel: It specifies the Label of the gallery for screen readers. Also, it describes what is the list of items.
  • BorderColor: It specifies the control’s border color.
  • AllItems: It defines all items in a gallery including all the control values of the gallery’s template.
  • Fill: It specifies the background color of a control.
  • DisplayMode: It defines whether the control allows user input (Edit), View, or Disabled mode.
  • DelayItemLoading: It specifies the delay loading of items until after the screen first loads.
  • ItemAccessibleLabel: It describes what each item is and specifies the label of each gallery item for screen readers.
  • LoadingSpinner (None, Controls, or Data): Spinner will not be shown when it is None. When it is Controls or Data, the spinner will be shown when a render pass occurs that results in visible empty rows.
  • Selectable: It defines whether the gallery items can be selected or not. When a user set to true, then the screen readers identify the gallery as a selectable list. When a user set to false, then the screen readers identify the gallery as a regular list.
  • NavigationStep: How far a gallery scrolls if its ShowNavigation property is set to true and the user selects a navigation arrow at either end of that gallery.
  • ShowNavigation: It defines whether an arrow appears at each end of a gallery so that a user can scroll through the gallery items by selecting an arrow.
  • ShowScrollbar: When the user hovers over a gallery, it defines whether the scrollbar appears or not.
  • TemplateFill: It helps to specify the background color of a gallery.
  • TemplateSize: It defines the height of the template for a gallery in vertical/portrait orientation.
  • Visible: It specifies whether a control displays or is hidden.
  • Width: The distance between a control’s left and right edges.

PowerApps Gallery SharePoint List

Here we will see how we can use or add a SharePoint Online list to PowerApps Gallery control. Let’s take an example. Let’s explore the PowerApps gallery SharePoint list filter.

Example:

I have a SharePoint Online List named Project Details. This list has these below columns with different Data types. Also, it has some records as shown below.

PowerApps Gallery SharePoint List
PowerApps Gallery SharePoint List

Here, I want to display all these record details in a PowerApps Gallery control. Follow these below steps to do so:

  • Sign in the PowerApps app with your credentials.
  • Create a blank new Canvas app and choose any one Layout either Tablet or Phone.
  • On the PowerApps Blank screen, connect the SharePoint Data source and add the SharePoint Online List to the app (Not only you can use the SharePoint list, but also you can use the SharePoint Library).
  • To add the SharePoint list, Go to View tab -> Data Sources -> Search SharePoint -> Add a new or existing connection -> Select the SharePoint Site -> Choose the specific SharePoint List (Project Details) -> Hit on the Connect button. Then the specific SharePoint list will be added as shown below.
PowerApps Gallery SharePoint
PowerApps Gallery Control example
  • Next, Insert a Gallery control (Insert -> Gallery -> Vertical) in the Powerapps screen. You can choose any template from the Gallery control. When you will add, the gallery will appear as the below screenshot.
  • By default, the Items property of the PowerApps Gallery control is CustomGallerySample.
powerapps gallery sharepoint library
PowerApps Gallery Control
  • Select the Vertical Gallery control and add the SharePoint list (Project Details) to the Data source from the Properties pane.
  • When you will change the Data source, at the same time, the Items property will change to the SharePoint List name as shown below.
  • If you want to change the Gallery Layout, then you can select it by using the Layout property.
Powerapps gallery control using SharePoint list
PowerApps Gallery Control
  • In this below, I have changed the Gallery Layout to “Title, subtitle, and body“. If you will click on the Edit option from the Fields section, then you can see all the field Data that is displaying in the gallery control.
  • In the Gallery control, you can display the field data by selecting the fields as per your need as below.
Powerapps gallery control SharePoint list
PowerApps Gallery Control Filter

PowerApps Gallery Control Filter

Now, let us check about PowerApps gallery control filter.

Suppose you have a PowerApps Gallery control with some records. Among all the records, you want to filter some records based upon the requirement. Then, in this case, you can use the Filter function in the gallery control.

Follow these below steps:

Step-1:

I have created a SharePoint Online list named Travel Details. This list has these below columns with different data types as:

  • Traveler: By default, this is a Title column with a single line of the text data type. Just I renamed it to Traveler.
  • Source: This is the column with Choice Data type
  • Destination: This is also a Choice Data type column
  • Date: Date and Time Data type column
  • Driver: Single line of text Data type
  • Vehicle: Single line of text Data type

This Travel Details list has some records as shown below:

PowerApps Gallery Control Filter
PowerApps Gallery Control Filter

Step-2:

  • Create a Blank PowerApps canvas app and choose either the Phone Layout or Tablet Layout.
  • On the PowerApps Blank screen, Connect the SharePoint Data source and add the SharePoint list (Travel Details) to the app.
Powerapps gallery filter
PowerApps Gallery Control Filter

Step-3:

  • Insert a Blank Vertical Gallery control (Insert -> Gallery -> Blank vertical).
  • Add the SharePoint list data source to the gallery (Select the Gallery control -> Go to Properties pane -> Select the Data source as Travel Details).
  • Select the Gallery Layout to “Title, subtitle, and body“. By default, the gallery control layout was Blank. Then the Gallery will appear as below screenshot.
  • If you want to display the other fields, then you can click on the Edit option from the Fields section and choose your desire fields over there.
How to filter PowerApps Gallery control
PowerApps Gallery Control Filter

Step-4:

  • Above this Gallery control (Blank vertical Gallery), Insert a Blank Horizontal Gallery control (Insert -> Gallery -> Blank horizontal).
  • Select the Blank Horizontal Gallery control and apply this below formula on its Items property as:
Items = Sort(Distinct('Travel Details',Left(Title,1)),Result,Ascending)

Where,

  1. Sort = The Sort function will display the letter in the Ascending order.
  2. Distinct = The Distinct function will display the “Traveller” columns (Title column from SharePoint list) first letter from the left side.
  3. Travel Details = SharePoint List Name
How to filter PowerApps Gallery

Step-5:

  • Click on Add an item from the Insert pane (from the Horizontal blank gallery control) and insert a Label control (Insert -> Label).
powerapps filter and sort gallery

Step-6:

  • Select the Label control and apply this below formula on its FontWeight property as:
FontWeight = If(ThisItem.IsSelected,Bold,Normal)

This above formula specifies, if the item is selected, then it should be visible in Bold letter otherwise in Normal letter as shown below.

Filter powerapps gallery control

Step-7:

  • Select the Gallery control (Blank Horizontal) and change its Fill property to RGBA(91, 170, 59, 1).
  • Select the Label control and apply this below formula on its Fill property as:
Fill = If(ThisItem.IsSelected,Red,Yellow)

This above code specifies, if the item is selected, then the selected item will display in Red color otherwise Yellow color.

Filter powerapps gallery controls
PowerApps Gallery Control Filter example

Step-8:

  • Select the Blank vertical Gallery control and apply this below formula on its Items property as:
Items = SortByColumns(Filter('Travel Details',StartsWith(Title,Gallery2.Selected.Result)),"Title")

Where,

  1. Travel Details = SharePoint List Name
  2. Title = It is the Traveller column from SharePoint list
  3. Gallery2.Selected.Result = Blank Vertical Gallery Control Name
Powerapps filter gallery control

Step-9:

  • Save and Preview (F5) the app. Select any letter from the top of the page. Then it will show that particular user name as shown below.
  • For example, here in the below screenshot, when I have selected the letter S (with Bold and Red color), then it is showing all the traveler names that belong to the letter S.
Powerapps Gallery control filter items

PowerApps Gallery Table

  • PowerApps Gallery Table is similar to the PowerApps Grid View. A graphical representation of a tabular view of Data is known as Grid view or a DataGrid.
  • When you will create the table or grid in Powerapps using any Gallery control, then it is known as PowerApps Gallery Table.
  • You can refer this below link to create a PowerApps Gallery Table:

PowerApps Gallery Template Size

  • Suppose you want to increase or decrease the size of PowerApps Gallery Template depending upon the gallery items.
  • In that case, instead of using a normal gallery control, you can use a Flexible height Gallery control or Blank Flexible height Gallery control. By using this gallery control, you can increase the gallery template size to its Auto-height property.
  • Normally, When you are adding a standard Powerapps Gallery control (either Blank horizontal or vertical Gallery control, Vertical or Horizontal Gallery control), By default, its TemplateSize property is “Min(168, Self.Height – 60)“.

PowerApps Image Gallery Control

  • In this scenario, we will see how we can use an image or picture in PowerApps Gallery Control. Let’s do it.
  • Suppose you have a SharePoint Document Library that is used to store the employee images or pictures. However, you want to get them (images) displayed in the PowerApps Gallery Control.
  • This is a very easy and simple thing to display an image in the PowerApps Gallery control. Refer this below link to add the SharePoint Library Images to PowerApps Gallery:

PowerApps Set Gallery Selected Item

Here we will see how we can set the Gallery selected item as a Default item in Powerapps. To set the default item, we can use the Default property of Powerapps Gallery control. Follow this below example.

  • On the PowerApps screen, I have a Vertical Gallery control and an Edit from.
  • I have set the Items property of Gallery control is my SharePoint List name (‘Travel Details‘).
  • I have set the Items property of Edit form is Gallery4.Selected (where Gallery4 is the Gallery control name).
  • This means, when you will select a particular item from the Gallery control, then that specific item details will appear in the Edit form as shown below:
PowerApps Set Gallery Selected Item
  • Next what I want to do is, I want to set a default value from the Gallery control. So that every time the form will display that particular value that you set in the Default property by default (before you select any item in the gallery).
  • If you do not have any formula in Gallery control’s Default property, then the edit form will display the first item by default. (before you select any item in the gallery)
  • To set the Gallery control Default value, Select the Gallery control and apply this below formula on its Default property as:
Default = LookUp('Travel Details',Title="Preetish Chaturvedi")

Where,

  1. Travel Details = SharePoint List name
  2. Title = SharePoint list column
  3. “Preetish Chaturvedi” = Specify the name that you want to set as the Default value or item. This is the name present in the Title column. The specified name or item should be the same as the Gallery item name.
set default property in powerapps gallery control
  • Save and Preview the app. You can see the Edit form will appear with the Default name that you have specified in the Gallery control’s Default property.

PowerApps Filter Gallery By Current User SharePoint 500 Record Limitation

Let us check out a solution, PowerApps Filter Gallery By Current User SharePoint 500 Record Limitation issue.

  • First of all, we need to know what does the mean by PowerApps Filter Gallery By the Current user and what is the 500 record limitation in SharePoint.
  • There is a PowerApps Gallery that is having some records including the user names. Suppose you want to filter the record based upon the current user. That means, when you are the PowerApps Current user, then you only can able to see your records, not everyone can see your record.
  • SharePoint 500 Record Limitation stands for the PowerApps Delegation. It means, if the SharePoint list is having 500 records or less than that, then the app will work fine. But if the list is having more than 500 records, then it will provide us a Delegation warning. For this issue, we need to extend the Data row limit from 500 to 2000.

So lets take an example for better understanding.

  • I have a SharePoint Online list named SharePoint Project Expenses. This list is having these below columns with different data types as:
  1. Project Name: By default, it is Title column with Single line of text data type. Just renamed it to Project Name.
  2. Number of User: Number Data type
  3. Typical Software Costs: Currency Data type
  4. User Licenses: Currency Data type
  5. Project Created Date: Date and Time Data type
  6. Project Location: Choice Data type
  7. Project Handler: Person Data type
PowerApps Filter Gallery By Current User
PowerApps Filter Gallery By Current User
  • Next, in the Powerapps app, I have a Horizontal Gallery control and set its Items property to ‘SharePoint Project Expenses‘ (SharePoint list name).
  • Once you will set the list to gallery control, then you can see all the records of all users (Project handler) as shown below.
powerapps filter sharepoint list by current user
PowerApps Filter Gallery By Current User SharePoint 500 Record Limitation
  • But according to our requirement, we do not require other users record details. We only need the current user’s record details in the PowerApps Gallery control.
  • Select the Gallery control and apply this below formula on its Items property as:
Items = Filter('SharePoint Project Expenses', User().Email='Project Handler'.Email)

Where,

  1. ‘SharePoint Project Expenses’ = SharePoint Online List name
  2. ‘Project Handler’ = Person Data type column from the SharePoint List that is having all the user names
  • As I am the Powerapps Current Logged in user (Preeti Sahu), So after applying the formula, I only can able to see my specific record details in the gallery control. At the same time, I can not see other user’s record details.
Powerapps gallery control filter by current user
PowerApps Filter Gallery By Current User example
  • If you will log in with another PowerApps user, then he or she can able to see his/her specific record details, not everyone’s record as shown below.
Powerapps gallery filter by current user
  • Now its time for the Data source record limitation. You can see a yellow color warning icon is appearing in the PowerApps Gallery control. The warning icon stands for the PowerApps Delegation Warning.
  • If you have more than 500 records in your datasource, please make sure you update the below setting:

Navigate File -> Settings -> Advanced Settings -> Data Row Limit for Non-Delegable queries -> Set this to 2000 as shown in the below screenshot.

Powerapps delegation warning
PowerApps Filter Gallery By Current User SharePoint 500 Record Limitation

PowerApps Filter Gallery by Dropdown

In this scenario, we will see how to filter a Powerapps gallery control by depending upon the Dropdown control selection value.

  • I have a SharePoint List named Project Details. This list has different types of columns with different data types. Among all those columns, it has a Choice column named Project Status.
  • This Project Status column has four different choice values such as:
  1. Submitted
  2. Approved
  3. Rejected
  4. Pending

Here, I want to filter the record based upon my Project Status. Suppose, If I will select the status as Approved (from the Dropdown control), then the gallery will filter and it will show only the records that are Approved.

PowerApps Filter Gallery by Dropdown
PowerApps Filter Gallery by Dropdown
  • On the PowerApps screen, I have a Vertical Gallery control with the SharePoint Data source (Project Details). This gallery is having all the list records as shown in the below screenshot.
PowerApps Filter Gallery by Dropdown control
  • Similarly, I have a Dropdown control (Project Status) that helps to choose a Status value. As I want to get all the Status value from the SharePoint list, So I have applied this below formula on Dropdown’s Items property as:
Items = Choices('Project Details'.'Project Status')

Where,

  1. ‘Project Details’ = SharePoint list name
  2. ‘Project Status’ = Choice column from the SharePoint list
Filter Gallery by Dropdown control in PowerApps
PowerApps Filter Gallery by Dropdown
  • Next, select the vertical gallery control and apply this below formula on it’s Items property as:
Items = Filter('Project Details', 'Project Status'.Value = ddProjectStatus.Selected.Value)

Where,

  1. ‘Project Details’ = SharePoint List name
  2. ‘Project Status’ = This is the Choice column from the SharePoint list (Project Details)
  3. ddProjectStatus = Project Status Dropdown control name
Filter Gallery by Dropdown in PowerApps
PowerApps Filter Gallery by Dropdown
  • Save and Preview (F5) the app. Choose any status value (suppose Approved) from the Dropdown control (Project Status). Then, you can see the filtered records will appear in the Powerapps Gallery control as below.
how to filter Powerapps gallery by Dropdown
how to filter Powerapps gallery by Dropdown
  • Similarly, if you will change the Project Status to Pending, then again the record will filter and it will display all the records that are in Pending mode as shown below.
how to filter Powerapps gallery by Dropdown control

This is about PowerApps Filter Gallery by Dropdown.

PowerApps Filter Gallery by Text input

Let us check about PowerApps Filter Gallery by Text input.

  • In this example, I need to filter a Gallery control by name using one Text input control where the backend is a SharePoint list named SharePoint Project Expenses.
  • The column that I would like to filter by is actually a Person or People picker field named Project Handler as shown below. Additionally, I’d like for all the gallery items to display when the text input is empty.
PowerApps Filter Gallery by Text input
PowerApps Filter Gallery by Text input
  • We can do this requirement by using the Text input control, but the only problem is the PowerApps Delegation issue.
  • If your list won’t be more than 500-2000 items, then you do not have to worry about that. You can exceed your PowerApps Data limit range from 500 to 2000. Also, without any doubt, you can use the Text input control and write this below formula on Gallery’s Items property as:
Items = Filter(
    'SharePoint Project Expenses',
     txtProjectHandler.Text in 'Project Handler'.DisplayName
)

Where,

  1. ‘SharePoint Project Expenses’ = SharePoint list name
  2. txtProjectHandler = Text input control name
  3. ‘Project Handler’.DisplayName = People picker field from the SharePoint list and it will display with the Display name.

Below is the screenshot for your reference where the Project Handler is the Text input control and another one is the Powerapps Vertical Gallery control.

Powerapps gallery filter by text input
PowerApps Filter Gallery by Text input
  • Now Save and Preview the app. Enter a Project Handler name inside the Text box. Then you can see the filtered records will appear in the Powerapps Gallery control as like the below screenshot.
  • Also, the gallery control will show all the records when the text input control will be empty.
Powerapps filter a gallery by text input control
  • In case, if your SharePoint list is so big, then in that case you can use a PowerApps Combobox control. Select the combo box control and set the below formula on its Items property as:
Items = Sort(
    Distinct(
        'SharePoint Project Expenses',
        'Project Handler'.DisplayName
    ),
    Result,
    Ascending
)
PowerApps Filter Gallery by Text input control
PowerApps Filter Gallery by Text input
  • Next, select the Gallery control and apply this below formula on it’s Items property as:
Items = Filter(
    'SharePoint Project Expenses',
    'Project Handler'.DisplayName = ComboBox1.Selected.Result || IsBlank(ComboBox1.Selected.Result)
)

Where,

ComboBox1 = Combobox control name (Project Handler)

Filter Gallery by Text input in PowerApps
  • Save and Preview the app. As there is no need to type the name in the combo box, because, the user names will show automatically from the SharePoint list column. Select the name from the Combo box and you can see the filtered records will appear in the Powerapps gallery control as shown below.
Filter Gallery by Text input control in PowerApps
PowerApps Filter Gallery by Text input
  • Similarly, if you won’t select any user name from the combo box (Project Handler), then the gallery control will appear with all the SharePoint list records as like the below screenshot.
how to Filter Gallery by Text input control in PowerApps

This is all about PowerApps Filter Gallery by Text input.

PowerApps Filter Gallery by Date Range

You can also filter a PowerApps Gallery control by selected between the two Date Range. Let’s take some simple scenarios that how you can use it easily.

Below represents the SharePoint List named Travel Details. This list has two Date columns as “Travel Start Date” and “Travel End Date“. We will filter the PowerApps gallery based upon these two SharePoint Date columns.

PowerApps Filter Gallery by Date Range

Example-1:

In this example what I am going to do is, When a user will select a specific date from the date picker control, then the record will filter. At the same time, the PowerApps gallery will show those particular records that belong to the selected date by the user.

  • I have a Date Picker control (Travel Start Date) and I just renamed it to ddStartDate. When you will add the Date picker control, by default, it will appear with Today’s date as shown below.
  • Similarly, there is a Powerapps gallery control that helps to display the records from the SharePoint list (Travel Details).
Filter Gallery by Date Range PowerApps
PowerApps Filter Gallery by Date Range
  • Next, Select the Gallery control and set this below formula on it’s Items property as:
Items = Filter('Travel Details', 'Travel Start Date' = ddStartDate.SelectedDate)

Where,

  1. ‘Travel Details’ = SharePoint list name
  2. ‘Travel Start Date’ = Date column from the SharePoint list
  3. ddStartDate = Date picker control name
how to Filter Gallery by Date Range PowerApps
PowerApps Filter Gallery by Date Range
  • Now save and preview the app. Select a date from the date picker control. The filter will record and show the details from that specific selected date.
how to Filter Gallery by Date Range in PowerApps

Example-2:

Let’s take another example. There are two Date Picker controls named “Travel Start Date” and “Travel End Date“. Here what I want to do is:

  • The user will select a Date from the first Date picker control (Travel Start Date).
  • The user will select a Date from the second Date picker control (Travel End Date).
  • Then the Gallery control will filter and it will display those particular records that are in between the Travel Start Date and Travel End Date.
powerapps filter by date range
PowerApps Filter Gallery by Date Range
  • To do so, Select the Gallery control and apply this below formula on its Items property as:
Items = 
Filter(
    'Travel Details',
    'Travel Start Date' >= ddStartDate.SelectedDate && 'Travel End Date' <= ddEndDate.SelectedDate
)

Where,

  1. ‘Travel Details’ = SharePoint List name
  2. ‘Travel Start Date’, ‘Travel End Date’ = Both are Date column from the SharePoint list
  3. ddStartDate = First Date picker control name (Travel Start Date)
  4. ddEndDate = Second Date picker control name (Travel End Date)
powerapps gallery filter by date range
  • Now save and preview the app.
  • Select a date from the first date picker control (Travel Start Date).
  • Select a date from the second date picker control (Travel End Date).
  • Then the gallery control will filter and show those specific record details that are in between two date picker controls.
gallery filter by date range in powerapps

If you are interested to learn more about the PowerApps Date filter examples, then you can refer these below links:

This is about PowerApps Filter Gallery by Date Range.

PowerApps Filter Gallery by Date

Suppose you want to filter the gallery items only when the field date is higher than the selected Date. That means, As today’s date is “9/29/2020”, So I want to filter the items that are higher than today’s date.

  • As the above example, Here also I have taken the same SharePoint list (Travel Details).
  • PowerApps Filter Gallery by Date, We need to apply this below formula on Gallery’s Items property as:
Items = Filter('Travel Details', 'Travel Start Date'>=Date(2020,9,29))

Where,

  1. ‘Travel Details’ = SharePoint list name
  2. ‘Travel Start Date’ = Date column from the SharePoint list

In this above formula, you need to specify a specific Date within the Date function. So that the records will evaluate and it will display those are higher than that specified date.

PowerApps Filter Gallery by Date

This is all about PowerApps Filter Gallery by Date.

PowerApps Filter Gallery by multiple Dropdown

Here we will see how we can filter the Powerapps gallery by selected multiple dropdown control values. Follow this below example for more details.

In this example, there are multiple numbers of Dropdown controls available on the Powerapps screen. The user will choose the value from all the dropdown controls. Then, the gallery will filter and it will show those particular records based upon the user selections (from all the dropdown controls).

  • I have a SharePoint list named Project Details. This list has three Choice columns as:
  1. Employee Job (Permanent, Temporary, Contract)
  2. Client (Conros, TSInfoTechnologies, Intel, HCL, Dynamic Systems)
  3. Project Status (Submitted, Approved, Rejected, Pending)
PowerApps Filter Gallery by multiple Dropdown
  • On the PowerApps screen, I have a Vertical Gallery control with SharePoint list Data source (Project Details) and Layout as Title, subtitle, and body as shown below.
PowerApps Filter Gallery by multiple Dropdown control
PowerApps Filter Gallery by multiple Dropdown
  • Also, I have inserted three Dropdown controls (for Employee Job, Client, and Project Status). Below are the formulas that I have applied in these three dropdown controls Items property as:
  1. Employee Job:
Items = Choices('Project Details'.'Employee Job')

2. Client:

Items = Choices('Project Details'.Client)

3. Project Status:

Items = Choices('Project Details'.'Project Status')

Where,

  • ‘Project Details’ = SharePoint List name
  • ‘Employee Job’, Client, ‘Project Status’ = All these are choice columns from the SharePoint list (Project Details)

Refer to the below screenshot.

How to Filter Gallery by multiple Dropdown control in PowerApps
PowerApps Filter Gallery by multiple Dropdown
  • Next, select the Vertical Gallery control and apply this below formula on it’s Items property as:
Items = Filter(
    'Project Details',
    'Employee Job'.Value = ddEmpJob.Selected.Value,
     Client.Value = ddClient.Selected.Value,
    'Project Status'.Value = ddProStatus.Selected.Value
)

Where,

  1. ‘Project Details’ = SharePoint list name
  2. ‘Employee Job’, Client, ‘Project Status’ = SharePoint list choice column names
  3. ddEmpJob = Employee job Dropdown control name
  4. ddClient = Client Dropdown control name
  5. ddProStatus = Project Status Dropdown control name
How to Filter Gallery by multiple Dropdown in PowerApps
  • Save and Preview the app. Select the value from Employee Job, Client, and Project Status dropdown control. If you will see the gallery, then the specific records have been filtered based upon those multiple dropdown controls as shown below.
Filter Gallery by multiple Dropdown in PowerApps
PowerApps Filter Gallery by multiple Dropdown

I hope you like the example on PowerApps Filter Gallery by multiple Dropdown.

PowerApps Filter Gallery by Combobox

As we learned that we can filter the Powerapps gallery by using the Dropdown selection, the Text input control, or the date picker control. Similarly, we can also filter the gallery by using the PowerApps Combo box control.

  • Below is the SharePoint list (Travel Details). It has a Choice column named Source that contains some choice values (like Bangalore, Hyderabad, Mumbai, Pune, etc).
  • In this example, When a user will select a source value (s) from the combo box, then the gallery will filter and display those specific records that belong to that combo box.
PowerApps Filter Gallery by Combobox
  • On the PowerApps screen, I have a Combobox (Travel Source), just renamed it to ComboTravelSource. The choice values I have shown from the SharePoint list column (Source).
  • To display the SharePoint choice value, select the Combobox, and set its Items property as:
Items = Choices('Travel Details'.Source)

Where,

  1. ‘Travel Details’ = SharePoint list name
  2. Source = Choice value from the SharePoint list

Once you will set the items, then the combo box will appear with all the SharePoint choice values.

How to Filter a Powerapps Gallery using a Combo Box
PowerApps Filter Gallery by Combobox
  • Also, I have a Gallery control that helps to display all the records from the SharePoint list (Travel Details). This gallery is needed, because when a user will select any source value (s) from the combo box, then the item will filter and it will siplay in the gallery control.
Powerapps Filter a Gallery using a Combo Box
PowerApps Filter Gallery by Combobox
  • To do so, select the gallery control and apply this below formula on its Items property as:
Items = Filter(
    'Travel Details',
    Source.Value in ComboTravelSource.SelectedItems.Value
)

Where,

  1. ‘Travel Details’ = SharePoint list name
  2. Source.Value = Source is the SharePoint choice column and as it is choice, so we need to specify it with “.Value“.
  3. ComboTravelSource = Combobox control name
Filter Powerapps Gallery using Combo Box
  • Now Save and Preview the app. Select the Travel Source (s) from the combo box. Then you can see all the filtered records will appear in the gallery control based upon the combo box selection as shown below.
PowerApps Filter Gallery by a Combobox
PowerApps Filter Gallery by Combobox

This is about PowerApps Filter Gallery by Combobox.

Also, you may like these below PowerApps Tutorials:

In this PowerApps Tutorial, We discussed what is Gallery control in PowerApps and what are the properties that present in the PowerApps Gallery control and PowerApps gallery control filter.

Also, By taking some simple scenarios, We covered these below topics as:

  • PowerApps Gallery SharePoint List
  • PowerApps Gallery Control Filter or How to filter items in PowerApps Gallery control
  • What is the PowerApps Gallery Table
  • PowerApps Gallery Template Size
  • What do you mean by PowerApps Image Gallery Control
  • How to set Gallery Selected Item in PowerApps
  • PowerApps Filter Gallery By Current User Sharepoint 500 Record Limitation
  • PowerApps Filter Gallery by Dropdown
  • PowerApps Filter Gallery by Text input
  • PowerApps Filter Gallery by Date Range
  • PowerApps Filter Gallery by Date
  • PowerApps Filter Gallery by multiple Dropdown
  • PowerApps Filter Gallery by Combobox
  • I’ve a multiselect choice column in SharePoint and Combobox in powerapps(multi-select). Your syntax below doen’t work correctly and missing certain items

    Items = Filter(
    ‘Travel Details’,
    Source.Value in ComboTravelSource.SelectedItems.Value
    )

    Is there anyway to fix this?

  • >