Blog

SharePoint - How to use radio buttons to set choice column values

To make it easier for users to enter a choice value when adding or editing a record, we can replace the default combobox control on a form with a radio control. This post walks though how to carry out this task.

When we build data entry screens with a single-select SharePoint choice column, we can use a radio control to provide a simple way for users to enter a choice value.

As an example, let's take the example of a form that's based on a SharePoint list of issues. This form includes a field called issue status. This is a single-select choice column with the following acceptable values: - In Progress, Open, and Closed.

Using a Radio control to display and edit choice items

To demonstrate how to use radio control to display and edit choice items, let's start with an auto-generated app thats based on the issues list.

The edit form includes a card that displays the issue status field. If the field doesn't appear, we can click the "edit fields" link from the properties pane of the edit form, and we can add the issue status field from this section of the designer.

By default, the card will include a combo box control that displays the available issue status choice items. We can delete the issue status combo box control, and replace it with a radio control. We'll name this control rdoIssueStatus.

When we delete the issue status combo box control, the designer will show various errors that relate to references to the combo box control that we deleted. We can work through these errors, and clear the formulas that refer to the old combo box control.



To configure the radio control to show the available choice column values, we set the items property of the radio control to the following formula:

Choices(Issue.IssueStatus)

The Choices function returns a table of available choice items. This function takes an input column in the format SharePointListName.ChoiceColumnName.


To configure the radio control to show the selected choice-value when the form opens an existing record, we set the Default property of the radio control to the following formula:

ThisItem.IssueStatus.Value


Finally, to configure the edit form to save the selected radio option, we set the Update property of the card to the following:

rdoIssueStatus.Selected


At this point, we can run our app and we can use the radio control to set the issue status choice field.

Showing only specific choice items in a radio control

To extend our example, let's take a look at a common requirement, which is to show a limited set of choices in the radio control. We can accomplish this by filtering the return value from the Choices function. For instance, if we want to allow users to choose the status values open and closed only, we can apply the following formula to the Items property of the radio control:

Filter(Choices(Issue.IssueStatus), 
Value in ["Open", "Closed"]
)

Conclusion

When we build data entry screens with a single-select SharePoint choice column, we can use a radio control to provide a simple way for users to enter a choice value. This post walked through the steps to amend an edit form to show choice values through a radio control, rather than a combo box control.