Power Apps Multiple Selection Checkbox

Power Apps Multiple Selection Checkbox

Multiple selection checkboxes give a user the ability to pick from one or more options. This feature does not come included in Power Apps. Fortunately we can make our own by combining a single checkbox with a gallery.

In this article I will show you how to make Power Apps with a multiple selection checkbox.

Table Of Contents
Introduction: Projects Backlog App
Add A Choices Column To The SharePoint List
Convert Combo Box Into A Gallery
Tracking Current Checkbox Selections
Writing Multiple Checkbox Selections To SharePoint
Loading A Form With Multiple Checkbox Selections




Introduction: Projects Backlog App

The Projects Backlog App is used by a software development team to track a list of projects that need to be done. A Project Manager assigns Developers to complete projects in the backlog according to one or more required skills.




Add A Choices Column To The SharePoint List

Create a new SharePoint list to called Projects Backlog to store data for the app. Add the following columns:

  • Title (single-line text)
  • Start Date (date)
  • Estimated Hours (number)
  • Skills Required (choices)



The Skills Required (choices) column needs 4 options: Power Apps, Power Automate, Power BI and Power Virtual Agent. It must have the Allow Multiple Selections setting enabled to allow more than one skill to be chosen.




Input this data into the SharePoint list…

TitleStart DateEstimated HoursSkills Required
Time Off Request App3/8/202180Power Apps, Power Automate
Safety Incidents Reporting3/22/2021240Power Apps, Power Automate, Power BI
Job Site Inspection App4/6/2021150Power Apps, Power BI



…and the result should look like the image below. Great! Let’s move on to building the app.

Open Power Apps Studio and create a new canvas app from blank. Insert a form into the app with the Project Backlog SharePoint list as its datasource. Set the DefaultMode of the Form to this code.

FormMode.New



The form should include all 4 fields from the SharePoint list by default. Skills Required appears as a Combo Box. We will replace it with a multiple selection checkbox input.



Delete the combo box and expand the size of the card to make space for the checkboxes. Don’t worry about any error messages. We will address those soon.



Insert a blank vertical gallery into the card…



…and write this code in the Items property. The choices function will populate the gallery with a table of valid options.

Choices('Projects Backlog'.'Skills Required')



Then place a checkbox from the input menu into the gallery…



…with this code in the text property. The checkboxes will now have the names Power Apps, Power Automate, Power BI and Power Virtual Agents beside them.

ThisItem.Value




Tracking Current Checkbox Selections

The Project Manager adds or more skills to the project and submits the form. Now that we have built the multiple selection checkbox we must track which skills were selected in a collection and write it to SharePoint once the form is completed.

Select the checkbox we placed in the gallery…



…and use this code in the OnCheck property. When the checkbox is filled it will write the value to a collection called colSkillsRequired.

Collect(colSkillsRequired, ThisItem.Value)



Oppositely, we want to remove the skill from colSkillsRequired when a checkbox is unchecked.



Put this code in the OnUnCheck property of the checkbox

RemoveIf(colSkillsRequired, Value=ThisItem.Value)




Writing Multiple Checkbox Selections To SharePoint


The Update property of the card controls what data written is to SharePoint when the form is submitted. Change the Update property to colSkillsRequired.



One of the error messages is now gone. To get rid of the other error message simply delete the ErrorMessage label. We don’t need it for this app.



To submit the form, place a new button below the form…



…and write this code in the OnSelect property. Then click the button to write data back to SharePoint.

SubmitForm(Form_NewProject);



When the form is submitted, we want it to display the current record in view only mode.



A few more lines of code will do the trick! Use this code in the OnSuccess property of the form.

Set(varCurrentProject, Form_NewProject.LastSubmit); ViewForm(Form_NewProject);




Then write this code in the Item property of the form.

varCurrentProject




Loading A Form With Multiple Checkbox Selections

We’re not quite done yet. The Projects Backlog app needs to display skills required for a project when the Project Manager comes back later to review the project.

Make a new screen and place a blank gallery with Projects Backlog as the Items property onto it.

'Projects Backlog'



The gallery should look like the image below. Include a label with ThisItem.Title in the Text property to display the project name and a right arrow icon to indicate the row is selectable.



Write this code in the OnSelect property of the gallery to get the current project, the skills required, change the form to Edit Mode and then Navigate the the New Project Form screen.

Set(varCurrentProject, ThisItem);
 ClearCollect(colSkillsRequired, varCurrentProject.'Skills Required');
 EditForm(Form_NewProject);
 Navigate('New Project Form');


You will not see any of the checkboxes highlighted. Why? We must assign a default value to them.



Use this code in the Default property of the checkbox.

ThisItem.Value in colSkillsRequired.Value



That’s it, we’re done!





Questions?

If you have any questions or feedback about Power Apps Multiple Selection Checkbox please leave a message in the comments section below. You can post using your email address and are not required to create an account to join the discussion.

Matthew Devaney

Subscribe
Notify of
guest
5 Comments
Oldest
Newest
Inline Feedbacks
View all comments
Andrew Holding
10 months ago

Another great job. Came in expecting some combo box info because I was distracted. Came away with an awesome tip to adapt across a few scenarios.

Danielle D Taylor
Danielle D Taylor
10 months ago

THANK YOU! I have been struggling with checkboxes in my first app and that last bit of code should solve it. You have been a big resource in my first foray into PowerApps. Thank you.

Iain Ray
Iain Ray
9 months ago

Hi Matt, ive followed your guide and another very similar a bit older but the Update and Default properties both error saying that expect a record value and my collection is a table. The SharePoint field was originally just a single choice but have since made it multiple select (checkboxes), ive removed and re-added the field in the PowerApps SP form and also removed and re-added the SharePoint connector. Just cant get it to accept the collection of choices, any ideas?

Thanks

Colby Turybury
Colby Turybury
6 days ago

When placing colSkillsRequired into the Update field it show an error saying “Expected Record Value.”