+ Start a Discussion
Lokesh Rayapati4Lokesh Rayapati4 

Create radio button in Lightning Aura components

Hi,
I created check box for fullday,Half day and Mixed day. So, I was trying to write this with the help of radio buttons because in check box i can select all three checkboxes at once.
<h1><b>Select Leave</b></h1>
<lightning:input type="checkbox" label="Full Day" name="Full Day" aura:id="apps" value="fullDay" onchange="{! c.handleChange }" />
<lightning:input type="checkbox" label="Half Day" name="Half Day" aura:id="product" value="halfDay" onchange="{! c.handleChange }" />
<lightning:input type="checkbox" label="Mixed Day" name="Mixed Day" aura:id="service" value="mixedDay" onchange="{! c.handleChange }" />

Thanks in advance
 
Surya GSurya G
Hi Lokesh,
you can use radio group base component to achieve this.

https://developer.salesforce.com/docs/component-library/bundle/lightning:radioGroup/example
 
<aura:component>
    <aura:attribute name="options" type="List" default="[
    {'label': 'Sales', 'value': 'option1'},
    {'label': 'Force', 'value': 'option2'}
    ]"/>
    <aura:attribute name="value" type="String" default="option1"/>

    <lightning:radioGroup name="radioGroup"
                          label="Radio Group"
                          options="{! v.options }"
                          value="{! v.value }"
                          type="radio"/>
</aura:component>
Thanks
Surya G
 
Suraj Tripathi 47Suraj Tripathi 47
Hi Lokesh Rayapati, 

you can take the Code from Aura Component library like this :
<aura:component>
    <aura:attribute name="options" type="List" default="[
    {'label': 'Sales', 'value': 'option1'},
    {'label': 'Force', 'value': 'option2'}
    ]"/>
    <aura:attribute name="value" type="String" default=""/>

    <lightning:radioGroup name="radioButtonGroupRequired"
                          label="Radio Button Group"
                          options="{! v.options }"
                          value="{! v.value }"
                          type="button"
                          required="true"/>
</aura:component>

you can learn and use the code from this link:
https://developer.salesforce.com/docs/component-library/bundle/lightning:radioGroup/example


If you find your Solution then mark this as the best answer to close this question


Thank you!

Regards
Suraj Tripathi