Implementing choices (multi select option set) component
This sample component demonstrates how to leverage the multi select option set type on properties of field
components. By binding the code component's primary property to this type, users can create all new types of controls with choices column.
Note
Control must be bound to a column of type MultiSelectOptionSet
, then the OptionSet associated with that column is populated in the component.
Available for
Model-driven apps
Code
You can download the complete sample component from here
In the manifest, a single property of type MultiSelectOptionSet is defined. This property is automatically bound to the OptionSet associated with whatever column the component is placed in the model-driven app.
This component renders a standard select
element, with options for each value in the OptionSet, and a text column to display all the currently selected options. Each value's onClick
call back is set to the updateIndividualSelected
method defined in this component. This method will either add or remove the selected option and then calls the notifyOutputChanged
to let the framework know there has been a change in the data.
For MultiSelectOptionSets, each option has a display name for the value as well as a numerical value associated with it. To track the currently selected options, the control maintains an array of the value's of all the currently selected options. This method is to align with what PCF expects back from the control for MultiSelectOptionSet in getOutputs
.
The getOutputs
method simply returns the currently selected set of values back to the framework for it to update. In updateView
method, the component simply updates the content of the selected options
text label to align with the newest value received from the framework through the MultiSelectOptionSet properyt's formatted value.
Related topics
Download sample components
How to use the sample components
Power Apps component framework API reference
Power Apps component framework manifest schema reference
Feedback
https://aka.ms/ContentUserFeedback.
Coming soon: Throughout 2024 we will be phasing out GitHub Issues as the feedback mechanism for content and replacing it with a new feedback system. For more information see:Submit and view feedback for