How to Display Column Names in Power Apps Dropdown?

Do you know how to retrieve and display column names in the Power Apps dropdown [whether it’s from the SharePoint list or Collection]?

This Power Apps tutorial helps to learn how to display column names in Power Apps Dropdown and many more like:

• How to retrieve SharePoint list column names in the Power Apps dropdown
• How to display Power Apps collection header names in the dropdown control

How to Display Column Names in Power Apps Dropdown [From SharePoint List]

Here, we will discuss how to display Power Apps dropdown column names from the SharePoint list.

Example:

1. I have a SharePoint Online List named “Monthly Budget Expenses“. This list contains the below columns.

Column Name	Data Type
Item	It is a default single line of text, I just renamed it as “Item”
Category	Choice
Budget	Choice
Amount	Currency
Month	Date and time
Description	Multiple lines of text

2. In Power Apps, there is a Dropdown control. This dropdown control will retrieve all the SharePoint Online list column names.

Refer to the below screenshot:

To achieve the above example, follow the below-mentioned steps. Such as:

4. Open the Power Apps -> Create Power Apps Canvas app -> Connect the SharePoint list, i.e., [Monthly Budget Expenses] to the app. Once you connect, it will look like the screenshot below.

5. Select Apps’s OnStart and set its property to the code below.

OnStart = Set(
    varListColumnNames,
    Distinct(
        Ungroup(
            MatchAll(
                JSON(
                    'Monthly Budget Expenses',
                    JSONFormat.IgnoreBinaryData & JSONFormat.IgnoreUnsupportedTypes
                ),
                "([^""]+?)""\s*:"
            ).SubMatches,
            "SubMatches"
        ),
        Value
    )
)

Where,

• Set() = This Power Apps Set() function can help us to set a global variable to the entire app
• varListColumnNames = Global Variable Name
• Distinct() = This function used to remove the duplicates in the table
• Ungroup() = This function returns a formula for breaking separate records
• MatchAll() = We can use this function to extract all text strings that match
• JSON() = This function helps us to represent a data structure as a text so that it is suitable for sorting or transmitting across a network
• ‘Monthly Budget Expenses’ = It is a SharePoint Online list and it is converted into the JSON format
• “([^””]+?)””\s*:” = Regular expressions to check the text again
• “SubMatches” = Group Name

Refer to the below image:

6. Then, click on the Run OnStart option under the App’s Commands (…) as shown below.

7. Insert a Dropdown control [Drp_ColumnNames] -> Set its Items property as:

Items = varColumnNames

Where,

• varColumnNames = Power Apps Variable Name

8. Save, Publish, and Preview the app. The dropdown control will display all column names from the SharePoint list based on the variable value as in the screenshot below.

This is how to display the Power Apps dropdown column names from the SharePoint list.

Power Apps Dropdown Column Names [From Collection]

Let’s see how to display or retrieve the Power Apps collection headers on the dropdown control.

Example:

1. I have created a Power Apps collection [colBudget] manually. This collection contains the below Headers or Columns.

Item	Category	Amount	Budget
Grocery	Food	1000	Within Budget
Wallpapers	Household	1500	Over Budget
Cab ride	Car/Transport	2000	Within Budget
Health checkup	Health	3000	Over Budget
Rent	Household	1200	Within Budget

Refer to the below screenshot:

2. In Power Apps, there is a Button control [Collection Headers/Columns] and a Dropdown control.

3. The dropdown will display all the Power Apps collection headers/columns when the user clicks the button control, as in the screenshot below.

To work around this example, follow the below steps. Such as:

4. Select the Power Apps Screen and set its OnVisible property to the code below:

OnVisible = ClearCollect(
    colBudget,
    {
        Item: "Grocery",
        Category: "Food",
        Amount: "$1000",
        Budget: "Within Budget"
    },
    {
        Item: "Wallpapers",
        Category: "Household",
        Amount: "$1500",
        Budget: "Over Budget"
    },
    {
        Item: "Cab ride",
        Category: "Car/Transport",
        Amount: "$2000",
        Budget: "Within Budget"
    },
    {
        Item: "Health checkup",
        Category: "Health",
        Amount: "$3000",
        Budget: "Over Budget"
    },
    {
        Item: "Rent",
        Category: "Household",
        Amount: "$1200",
        Budget: "Within Budget"
    }
)

Where,

• colBudget = Power Apps Collection Name
• Item, Category, Amount, Budget = Collection Headerds/Columns
• Grocery”, “Food”, “$1000”, “Within Budget” = Collection Rows/Records

5. Insert a Button control [btn_CollectionHeaders] and set its OnSelect property as:

OnSelect = Set(
    varCollectionColumnNames,
    Distinct(
        Ungroup(
            MatchAll(
                JSON(
                    colBudget,
                    JSONFormat.IgnoreBinaryData
                ),
                "([^""]+?)""\s*:"
            ).SubMatches,
            "SubMatches"
        ),
        Value
    )
)

Where,

• varCollectionColumnNames = Power Apps Variable Name
• colBudget = Power Apps Collection Name
• JSONFormat.IgnoreBinaryData = This format is to be used in the JSON conversion, and the value will be a number of the JSON format enumeration

6. Then, insert a Dropdown control and set its Items property as:

Items = varCollectionColumnNames

Where,

• varCollectionColumnNames = Power Apps Variable Name

7. Save, Publish, Reload, and Preview the app. When the user clicks on the button control, the dropdown will display all the Power Apps collection headers as shown below.

This is all about how to display or retrieve the Power Apps collection headers on the dropdown control.

Conclusion

I trust that this Power Apps tutorial provided detailed information regarding Power Apps dropdown column names, such as:

• How to retrieve SharePoint list column names in the Power Apps dropdown
• How to display Power Apps collection header names in the dropdown control

Also, you may like some more Power Apps tutorials:

• Validate Power Apps Dropdown Control
• Power Apps Dropdown Values Not Showing
• Bind SharePoint Lookup Column in Power Apps Dropdown
• Bind Power Apps Dropdown Items From Collection
• Bind Power Apps Dropdown Control From SharePoint Yes No Column
• Set Default Value in Power Apps Dropdown Control from SharePoint list