530
Views
9
Comments
How to Create a Radio Button and How to Stored the Value

Hi,

I Have Three Radio Button , When I Click one Radio Button. it Will Stored in Data. How?


Screenshot 2023-12-06 165151.png
2023-04-17 05-19-55
Vaishali Shrivastava

Hi @Ahamed Zuhail ,


You need to create one variable to hold the selected value. 

Please check this


Demo.oml
2023-10-31 07-36-11
Marlies Quaadgras
Champion

Hi @Ahamed Zuhail 


You have to define a variable for the radio button group. For each seperate radiobutton, you have to define a value. That value can come from a static entity, or any value  you want.

When the user clicks on 1 of the radio buttons, the variable is filled with the value defined on that radiobutton.

In the action to save, you can use the variable to save it in the db.


Best regards,  Marlies 

2025-06-01 02-51-51
YASH PAL

Hi @Ahamed Zuhail it's just the simple approach create a variable of type int and set that variable to that radio button group and then paas your values to each and every radio button like 1,2,3 and then you can store the value using that variable by an action on the submit button or an action on change of that radiobutton group. (to store the selected value just use that variable in your logic that you have bind to that radio button)

i hope this will help. thanks

UserImage.jpg
Himani Sharma

Hi @Ahamed Zuhail 

In Reactive Web and Mobile

Follow the steps to create a form with three options.

  1. Create a new Screen.

  2. Right-click the Screen in the widget tree and select Add Local Variable. Enter Color in the Name field. Service Studio sets the Data Type to Color.

  3. Search for Form in the toolbox and drag it to Screen.

  4. Search for Radio Group and drag it into the Form. Then:

    • Select the Radio Group widget.
    • In the properties of the Radio Group widget, in the Variable field, select Color.Color.
    • Radio Group properties

  5. Set the properties of Radio Buttons, which are the widgets inside the Radio Group widget.

    • For RadioButton1, select Entities.Color.Red in the Value property. Edit the label to "Rose".
    • For RadioButton2, select Entities.Color.Yellow in the Value property. Edit the label to "Lemon".
    • For RadioButton3, select Entities.Color.Violet in the Value property. Edit the label to "Plum".
    • Radio Button

  6. Drag an Expression widget below the Form and enter "You selected " + Color.Color + " color.".

  7. Publish the app and try it out in your browser.

    Radio Button in browser

Button Group

You can also use Button Group in Reactive Web and Mobile:

  1. Drag and drop the Button Group from the toolbox and bind it to the variable that will store the selected value.
  2. For each Button Group Item, define the value to assign to the variable when the Button Group Item is selected and edit the corresponding text label.

In Traditional Web

To use Radio Buttons in Traditional Web:

  1. Drag and drop the Radio Buttons from the widgets toolbox.
  2. For each Radio Button, bind it to the variable that will store the selected value and define the value to assign to the variable when the Radio Button is selected.

UserImage.jpg
Ahamed Zuhail

Thanks Sharma,

But i want to stored the data in the DB


UserImage.jpg
Himani Sharma

Hi @Ahamed Zuhail 

Please go through the shared Youtube link below, will guide you to store data into DB

https://www.youtube.com/watch?v=wRAxNmRaLPo&ab_channel=OutSystemsHow-Tos


Thanks 

Himani

UserImage.jpg
Himani Sharma

Hi @Ahamed Zuhail 

You can let users select a single option from a group of choices using radio buttons.

In Reactive Web and Mobile

Follow the steps to create a form with three options.

  1. Create a new Screen.

  2. Right-click the Screen in the widget tree and select Add Local Variable. Enter Color in the Name field. Service Studio sets the Data Type to Color.

  3. Search for Form in the toolbox and drag it to Screen.

  4. Search for Radio Group and drag it into the Form. Then:

    • Select the Radio Group widget.
    • In the properties of the Radio Group widget, in the Variable field, select Color.Color.
    • Radio Group properties

  5. Set the properties of Radio Buttons, which are the widgets inside the Radio Group widget.

    • For RadioButton1, select Entities.Color.Red in the Value property. Edit the label to "Rose".
    • For RadioButton2, select Entities.Color.Yellow in the Value property. Edit the label to "Lemon".
    • For RadioButton3, select Entities.Color.Violet in the Value property. Edit the label to "Plum".
    • Radio Button

  6. Drag an Expression widget below the Form and enter "You selected " + Color.Color + " color.".

  7. Publish the app and try it out in your browser.

    Radio Button in browser

Button Group

You can also use Button Group in Reactive Web and Mobile:

  1. Drag and drop the Button Group from the toolbox and bind it to the variable that will store the selected value.
  2. For each Button Group Item, define the value to assign to the variable when the Button Group Item is selected and edit the corresponding text label.

In Traditional Web

To use Radio Buttons in Traditional Web:

  1. Drag and drop the Radio Buttons from the widgets toolbox.
  2. For each Radio Button, bind it to the variable that will store the selected value and define the value to assign to the variable when the Radio Button is selected.


You can go through the shared youtube link, If required

https://www.youtube.com/watch?v=wRAxNmRaLPo&ab_channel=OutSystemsHow-Tos


Thanks

Himani

UserImage.jpg
ABHAY KRISHNA G

@Himani Sharma Hi.

I don't see there is an option called radio group widget in the SERVICE STUDIO 11 toolbox. Instead of that, there is radio button, Button Group, Button Group Items widgets alone there. 







I have used Traditional Web option to do this and I have entered the data in excel and imported the entity from excel, for that values are displaying, but if I manually enter the values, it's showing values for First Name, Last Name, E-Mail, Image(sometimes if I click a new image, the same images alone coming which came for previous records and unable to get the values for Gender(using radio button) and City(Combo Box). Kindly assist me 

 

2022-12-30 09-46-57
Deepika Patel

Hi @Ahamed Zuhail

You can refer the attached OML.

Hope this works for you!


RadioButton.oml
Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.