function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Øyvind Borgersen 10Øyvind Borgersen 10 

Lightning component radio button

Hi,

I'm trying to setup a simple lightning component with radio buttons, which will call an apex class to update the current users language. 

Does anyone has a lightning component + apex class example for this?
Best Answer chosen by Øyvind Borgersen 10
HariniLHariniL
Hi,

can you please try the below code and let me know if you find any difficulties.

Lightning component
Lightning component:
<aura:component controller="changeUserLanguage" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome" access="global" >
	<ui:inputRadio text="de" label="German" name="German" change="{!c.onGroup}"/><br/>
    <ui:inputRadio text="es" label="Spanish" name="Spanish" change="{!c.onGroup}"/><br/>
    <ui:inputRadio text="ko" label="Korean" name="Korean" change="{!c.onGroup}"/><br/>
</aura:component>
 
Lightning JS controller:


({
    onGroup : function(component, event, helper) {
        var action = component.get("c.updateUserLanguage");
        var selected = event.getSource().get("v.text");
        action.setParams({ 
            lang : selected
        });
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                alert("From server: " + JSON.stringify(response.getReturnValue()));
               }
            else if (state === "INCOMPLETE") {
            }
        });
        $A.enqueueAction(action);
    }
})
 
Apex class:

public class changeUserLanguage {
    @AuraEnabled
    public static user updateUserLanguage(string lang) {
       user userRec =[select id, languagelocalekey from user where id =:userinfo.getUserId()];
        userRec.languagelocalekey= lang;
        update userRec;
        return userRec;
    }
}

Add the lightning component whereever you want and see the output. Example: Home Page or Record page.

All Answers

HariniLHariniL
Hi,

can you please try the below code and let me know if you find any difficulties.

Lightning component
Lightning component:
<aura:component controller="changeUserLanguage" implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome" access="global" >
	<ui:inputRadio text="de" label="German" name="German" change="{!c.onGroup}"/><br/>
    <ui:inputRadio text="es" label="Spanish" name="Spanish" change="{!c.onGroup}"/><br/>
    <ui:inputRadio text="ko" label="Korean" name="Korean" change="{!c.onGroup}"/><br/>
</aura:component>
 
Lightning JS controller:


({
    onGroup : function(component, event, helper) {
        var action = component.get("c.updateUserLanguage");
        var selected = event.getSource().get("v.text");
        action.setParams({ 
            lang : selected
        });
        action.setCallback(this, function(response) {
            var state = response.getState();
            if (state === "SUCCESS") {
                alert("From server: " + JSON.stringify(response.getReturnValue()));
               }
            else if (state === "INCOMPLETE") {
            }
        });
        $A.enqueueAction(action);
    }
})
 
Apex class:

public class changeUserLanguage {
    @AuraEnabled
    public static user updateUserLanguage(string lang) {
       user userRec =[select id, languagelocalekey from user where id =:userinfo.getUserId()];
        userRec.languagelocalekey= lang;
        update userRec;
        return userRec;
    }
}

Add the lightning component whereever you want and see the output. Example: Home Page or Record page.
This was selected as the best answer
Ramesh DRamesh D
<aura:component description="Gender"               
                access="global"
                controller="YourController">     
    <aura:attribute name="gender" type="string" default="" access="PRIVATE" />
    <div>
        <fieldset class="slds-form-element">
            <legend class="slds-form-element__legend slds-form-element__label">Gender</legend>
            <div class="slds-form-element__control">
                <span class="slds-radio">
                    <input type="radio" id="radio-11" name="options" value="Male" onclick="{!c.changed}" />
                    <label class="slds-radio__label" for="radio-11">
                        <span class="slds-radio_faux"></span>
                        <span class="slds-form-element__label">Male</span>
                    </label>
                </span>
                <span class="slds-radio">
                    <input type="radio" id="radio-12" name="options" value="Female" onclick="{!c.changed}" />
                    <label class="slds-radio__label" for="radio-12">
                        <span class="slds-radio_faux"></span>
                        <span class="slds-form-element__label">Female</span>
                    </label>
                </span>
            </div>
        </fieldset>
        <lightning:button variant="success"
                          label="Save" title="Save Gender" onclick="{! c.SaveGender }" />
    </div>
</aura:component>
Controller: 
changed: function (component, event) {
        component.set("v.gender", event.target.value);
    },
    SaveGender: function (component) {
        const action = component.get("c.SaveGender");
        var gender = component.get("v.gender");
        action.setParams({
            gender: gender
        });
        action.setCallback(this, (resp) => {
            const state = resp.getState();
            if (state === "SUCCESS") {
            alert('Saved');
            
        }
                           });
        $A.enqueueAction(action);
    }
Apex Controller:
@AuraEnabled    
    Public static void SaveGender(string gender){
       //your logic goes here
    }

I hope you find the above solution helpful. If it does mark as best answer to help others too.

Thanks,
Ramesh D
 
Øyvind Borgersen 10Øyvind Borgersen 10
Thanks guys. Both examples are good.