cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
cbarcala
Regular Visitor

Form Radio Button How To (Show Default Value, Update on Save)

Thought this might be helpful for beginners. I scoured google and posts to find a solution to Radio buttons a while back and it took looking at many question/answer posts just to get all the steps needed to get a Radio button to show the default choice value and update it on save. This article is meant to walk you through setting up a Choice column and creating a Radio Button on a form to replace the default pulldown menu.

 

Purpose: Creating a Radio button on a Form to reflect a Choice column on a Sharepoint list. This article will show you how to create the Radio button and have it not only show the default choice selected but also update the Sharepoint list column on save. When creating a Radio button, by default it will not show the selected choice nor update the Sharepoint item list until these steps are done.

 

  • Create a Sharepoint list and add a Choice field with Yes, No options (choices can be anything)

    Screen Shot 2021-01-18 at 12.31.52 PM.png
    Screen Shot 2021-01-18 at 12.32.08 PM.png

  • Add some test data to the Sharepoint list

    Screen Shot 2021-01-18 at 12.35.35 PM.png
  • Create a Customized Form of the Sharepoint list as seen below.

    Screen Shot 2021-01-18 at 12.36.21 PM.png

  • Once on the Customized Form in Powerapps, select the Choice Card.

    Screen Shot 2021-01-18 at 12.36.50 PM.png
  • With the Choice Card selected, go to Insert -> Radio Button to add a Radio button into the Card. This will associate the Radio button to the Card.

    Screen Shot 2021-01-18 at 12.37.15 PM.png
    Screen Shot 2021-01-18 at 12.38.02 PM.png
  • Unlock the Data card if prompted

    Screen Shot 2021-01-18 at 12.43.12 PM.png
  • Your radio button is now displayed on the screen and within the Choice Card. Select the radio button and navigate to the Layout property on the left side for that button.

    Screen Shot 2021-01-18 at 12.43.22 PM.png
  • This is optional, but the Layout can be modified between Vertical and Horizontal

    Screen Shot 2021-01-18 at 12.38.43 PM.png

  • The radio button is now shown Horizontally.

    Screen Shot 2021-01-18 at 12.43.55 PM.png

  • While having the radio button selected, navigate to the Items property and start entering the following

    Choices(‘your sharepoint list name’.Choice)


    Screen Shot 2021-01-18 at 12.48.27 PM.png

  • The radio button now displays the choices of that field which are Yes, No in this case. As you can see, the values are not populated yet.

    Screen Shot 2021-01-18 at 12.48.46 PM.png

  • Select the Choice Card again and navigate to the Update property. 

    Screen Shot 2021-01-18 at 12.50.47 PM.png

  • Note, the property currently assigned is the value of the original Choice field on the form.

    Screen Shot 2021-01-18 at 12.50.51 PM.png

  • You need to change this to the Radio field name so that when the radio button is changed and saved on the form, it reflects the change on the Sharepoint list column.

    Screen Shot 2021-01-18 at 12.52.42 PM.png
  • Select the radio button again.

    Screen Shot 2021-01-18 at 12.53.29 PM.png
  • Navigate to the Default property of the radio button and make sure the following is selected:

    ThisItem.yourcolumnname.Value (The column name in this case is ‘Choice’)

    Screen Shot 2021-01-18 at 12.54.15 PM.png

  • The radio button will now show the default value selected on the item. Select the choice field again and navigate to the Visible property.

    Screen Shot 2021-01-18 at 1.05.02 PM.png
  • Finally, we will hide the original choice field (you can also delete the choice field) by selecting the Choice field and setting the Visible property to false.

    Screen Shot 2021-01-18 at 1.05.22 PM.png

  • Let's quickly add a Save icon (or any icon) to the form. (for beginners)

    Screen Shot 2021-01-18 at 1.06.00 PM.png

  • Take note of the Form’s name on the left pane

    Screen Shot 2021-01-18 at 1.06.25 PM.png

  • Set the following function on the Save icon’s OnSelect property to save/submit the form using the form name noted above.

    Screen Shot 2021-01-18 at 1.06.08 PM.png
  • Navigate back to the Sharepoint list and edit a test item previously created (or create one now)

    Screen Shot 2021-01-18 at 1.07.16 PM.png

  • Change the value of the Choice field and click the save icon (you can also just use the Save button shown)

    Screen Shot 2021-01-18 at 1.08.35 PM.png

  • The Sharepoint list has successfully updated the Choice and when you open an item in the view form, it will show the currently selected value as well.

    Screen Shot 2021-01-18 at 1.09.19 PM.png


    After performing these steps, the Radio button will now reflect the choice of the current item and update on save/submit to the Sharepoint list. I hope this helps other beginners to learn the different properties available when setting a Radio button up for the first time.
1 ACCEPTED SOLUTION

Accepted Solutions
timl
Super User III
Super User III

Thanks for sharing this @cbarcala - I'm sure it'll help those who are wanting to do this.

View solution in original post

1 REPLY 1
timl
Super User III
Super User III

Thanks for sharing this @cbarcala - I'm sure it'll help those who are wanting to do this.

View solution in original post

Helpful resources

Announcements
PA User Group

Welcome to the User Group Public Preview

Check out new user group experience and if you are a leader please create your group

Power Apps Community Call

Monthly Power Apps Community Call

Did you miss the call?? Check out the Power Apps Community Call here!

secondImage

Experience what’s next for Power Apps

See the latest Power Apps innovations, updates, and demos from the Microsoft Business Applications Launch Event.

Power Platform ISV STudio

Power Platform ISV Studio

ISV Studio is the go-to Power Platform destination for ISV’s to monitor & manage applications post-AppSource publish.

Top Solution Authors
Top Kudoed Authors
Users online (43,564)