function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
Thulasi ReddyThulasi Reddy 

How to show PickList field as Checkbox on Lightning Component?

Ajay K DubediAjay K Dubedi
Hi Thulasi,

You need to create a custom VF page or lightning component for this, Please have a look at the below references for help:
https://success.salesforce.com/answers?id=90630000000ghzFAAQ
https://developer.salesforce.com/forums/?id=906F0000000MH4DIAW

Hope this helps! If found helpful please don't forget to mark it best.

Thank you,
Ajay Dubedi
Khan AnasKhan Anas (Salesforce Developers) 
Hi Thulasi,

I trust you are doing very well.

Below is the sample code which I have tested in my org and it is working fine. Kindly modify the code as per your requirement.

Component: 
<aura:component controller="PicklistAsCheckboxC"
                implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
    
    <aura:attribute name="options" type="List" default="[
                                                        {'label': 'Hot', 'value': 'Hot'},
                                                        {'label': 'Warm', 'value': 'Warm'},
                                                        {'label': 'Cold', 'value': 'Cold'}
                                                        ]"/>
    
    <aura:attribute name="picklistValue" type="List"/>
    <aura:attribute name="accObj" type="Account" default="{ 'sobjectType' : 'Account',
                                                          'Name' : '',
                                                          'Rating' : ''
                                                          }"/>
    
    <lightning:input label="Name" value="{!v.accObj.Name}"/>
    
    <br/>
    
    <lightning:checkboxGroup 
                             aura:id="mygroup"
                             name="radioButtonGroup"
                             label="Choose Rating"
                             options="{! v.options }"
                             value="{! v.picklistValue}"
                             />
    
    <lightning:button class="slds-button slds-button_brand" label="Save" onclick="{!c.saveAcc}"/>
</aura:component>

Controller: 
({
    saveAcc: function (component, event) {
        var account = component.get("v.accObj");
        var rating = component.get("v.picklistValue");
        
        if(rating != undefined && rating.length > 0){
            account.Rating = rating[0]; 
        }   
        
        var action = component.get("c.saveAccount");
        action.setParams({acc: account});
        
        action.setCallback(this, function(response) {
            alert(response.getState());          
        });
        $A.enqueueAction(action);
    },   
})

Apex: 
public class PicklistAsCheckboxC {
    
    @AuraEnabled 
    public static void saveAccount(Account acc){
        insert acc;
    }
}


Reference: https://developer.salesforce.com/forums/?id=9060G000000MUZ0QAO


I hope it helps you.

Kindly let me know if it helps you and close your query by marking it as solved so that it can help others in future.

Thanks and Regards,
Khan Anas​
Thulasi ReddyThulasi Reddy

Thanks Khan Anas,

But i need only one value to select, if we select another value remaining will be deselected
Khan AnasKhan Anas (Salesforce Developers) 
Hi Thulasi,

If you want to select only one value, you can use lightning:radioGroup

Use below code in the component: 
<aura:component controller="PicklistAsCheckboxC"
                implements="force:appHostable,flexipage:availableForAllPageTypes,flexipage:availableForRecordHome,force:hasRecordId,forceCommunity:availableForAllPageTypes,force:lightningQuickAction" access="global" >
    
    <aura:attribute name="options" type="List" default="[
                                                        {'label': 'Hot', 'value': 'Hot'},
                                                        {'label': 'Warm', 'value': 'Warm'},
                                                        {'label': 'Cold', 'value': 'Cold'}
                                                        ]"/>
    
    <aura:attribute name="picklistValue" type="List"/>
    <aura:attribute name="accObj" type="Account" default="{ 'sobjectType' : 'Account',
                                                          'Name' : '',
                                                          'Rating' : ''
                                                          }"/>
    
    <lightning:input label="Name" value="{!v.accObj.Name}"/>
    
    <br/>
    
    <lightning:radioGroup 	 aura:id="mygroup"
                             name="radioButtonGroup"
                             label="Choose Rating"
                             options="{! v.options }"
                             value="{! v.picklistValue}"
                             />
    
    <lightning:button class="slds-button slds-button_brand" label="Save" onclick="{!c.saveAcc}"/>
</aura:component>


I hope it helps you.

Kindly mark this as solved if the information was helpful.

Thanks and Regards,
Khan Anas
Thulasi ReddyThulasi Reddy

Thanks Khan Anas,

Presently i was used lightning:radioGroup but i need it in checkboxes