I have a custom object Topics__c that I want list out like so:

enter image description here

The text is the topic name which is a String data type. So I have to add in a checkbox along side the Name field. I have been doing some research and it looks like <lightning:checkboxGroup> is the way to go with groups of checkboxes. My only hang up is I am not sure how to bind the topic to the checked item and pass that value to the controller.

This is what I have so far:

<aura:component implements ="force:lightningQuickAction, force:hasRecordId" controller="EditMeetingReport">
   <aura:handler name="init" value="{!this}" action="{!c.doInit}"/>
   <aura:attribute name="selectedTopics" type="List[]"/>
   <aura:attribute name="topicList" type="List[]" default="topicList" />

   <lightning:recordEditForm recordId="{!v.recordId}"
                          aura:id = "editMeetingReportForm">
   <lightning:messages />
   <lightning:inputField fieldName="Name" />
   <lightning:inputField fieldName="Date__c" />
   <lightning:checkboxGroup aura:id="checkbox"
                             name="Checkbox Group"
                             label="Add Topics"
                             options="{! v.topicList }"
                             value="{! v.selectedTopics }"/>
<lightning:button type="submit" name="save" label="Update" class="slds-button_brand"/>

JS Controller

doInit : function(component, event, helper) {
    var recordId = component.get("v.recordId");
    var action = component.get("c.getTopicList");
    action.setCallback(this, function(result){
        var state = result.getState();
        if (component.isValid() && state === "SUCCESS"){
            component.set("v.topicList", result.getReturnValue());
onSubmit : function(component, event, helper) {
    var inputCmp = component.find("checkbox");
    var value = inputCmp.get("v.selectedTopics");
    console.log('inputCmp: ' + inputCmp); //not giving me the right output
    var selectedTopics = component.get("v.selectedTopics");
    console.log('selectedTopics: ' + selectedTopics); //not giving me the right output

Should I be using <aura:iteration> and <lightning:input> instead because I am using two different objects in one table?

How do I get the selected Topic's saved into the selectedTopics list?


The data type for the attribute is incorrect. It should be List, not List[] (which means a List of Lists). I'd also recommend setting a default (empty) list:

<aura:attribute name="selectedTopics" type="List" default="[]" />

Everything else should be fine.

  • thank you. I also found that the topicList is set as a list of the Topic__c object rather then like this: component.set("v.topicList", [{ label: "Insurance", value: "a07S0000007dOIVIA2"}, { label: "WEISX", value: "a07S0000007dOIzIAM" }]); Do you know if and why the format of the options attribute as to be set exactly like this format with the label and value? I believe this is the reason why I couldn't set the selectedTopics attribute. I am having trouble dynamically building the topic list in this exact format. – Olivia Mar 18 '19 at 2:07
  • @Olivia options has to be in that format because that is how the code was written. The documentation is clear on this. To convert a record to an acceptable list of options, you can do this: var options = records.map(record=>({label:record.Name,value:record.Id})); – sfdcfox Mar 18 '19 at 2:18
  • ah thank you so much, this was so helpful. One last question if you don't mind. what data type would selectedTopics be? When I pass the selectedTopics values to an apex class from the controller, I am passing it as a List<String> or a List<Sobject> but neither seem to be registering the values in the class. – Olivia Mar 18 '19 at 2:37
  • 1
    @Olivia List<String> should work. Maybe it's how you're trying to pass them in? They should be an Array in JavaScript. – sfdcfox Mar 18 '19 at 3:11

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.