1

I want to populate Multiselect field with list of values dynamically. Instead of assigning the values to Array of string in aura attribute, I'm referring to the object from controller directly, But my multiselect field is not populating values. Since this is dynamic field, I can't assign values to list in aura:attribute and refer it. Please guide.

Component:

<aura:iteration items="{!v.myMetadata}" var="md" indexVar="index">
<aura:if isTrue="{!(md.datatype == 'multi')}">
    <lightning:dualListbox aura:id="selectGenre"                                                                    
              name="Genre"
              label="{!md.label}"
              sourceLabel="Available Genre"
              selectedLabel="Selected Genre"
              options="{!md.values}"
              />
     </aura:if>
</aura:iteration>

Helper:

var records =response.getReturnValue();
                  records.forEach(function(record) {
                  var mdValues = [];  
                 //Values__c is a comma seperated text field from object, example A,B,C               
                  if(record.Values__c){
                    nameArr  = record.Values__c.split(',');
                    for (var i = 0; i < nameArr.length; i++) {
                        mdValues.push(nameArr[i]);
                    }
                }
               //mdValues is list of string that has A,B,C Values
                mData.push({
                    label : record.Field_Label__c,
                    datatype : record.Datatype__c,
                    section : record.Section__c,
                    values : mdValues
                });
                console.log('mData:');
                console.dir(mData);
            });
            var defValues = response.getReturnValue();
            component.set("v.myMetadata",mData);

1 Answer 1

2

Looking at your code, I'm assuming that the dual list box shows up as shown in screenshot below. Note the empty highlighted option under the Available section.

enter image description here

The dual list box sees the entries to be used, but can't parse it into a label & value. Refer here,

Name: options
Type: object[]

Description: A list of options that are available for selection. Each option has the following attributes: label and value.

You possibly need to change this line mdValues.push(nameArr[i]); to the following snippet:

 mdValues.push({ label: nameArr[i], value: nameArr[i] });

Disclaimer: I've responded simply by looking at your code. Have not tried to replicate the problem at my end.

2
  • thanks Arut, that correct. If I update my code per your suggestion, how do I populate the dualListBox?
    – Anurag
    Nov 17, 2020 at 5:56
  • It worked, got it. thanks for the response
    – Anurag
    Nov 17, 2020 at 5:57

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.