I'm trying to populate list of options for lightning:dualListbox in my aura component but facing an issue.

I wanted to display the option with combination of two custom fields like Acc Number + '-' + Acc Name.

JS Helper:

var items = [];
for(let i=0;i<result.length;i++){
 items.push({label:result[i].field1 + ' - ' + result[i].field2, value:result[i].accountId});


<lightning:dualListbox name="Accounts" label="select combination" sourceLabel="Available" selectedLabel="Selected" options="{!v.options}"/>

Multipicklist populates as expected, but when I click to select a value, it highlights all picklist options and when I move it to right for selection, only 1 random label is pushed and all others vanish from available box on left. I can't add screenshot here due to restrictions but its weird.

I tried returning wrapper with label and value from apex to eliminate JavaScript helper(thought this might have something to do this JS), but same behavior.

If I make "value" and "label" same (remove accountid from value and making label and value as combination), it works.

But my case is to have value as accId and label as combination so that I can add list of id's for selection and pass to apex for processing.

Pls help.

1 Answer 1


Make sure the accountid value is different for each option, cause I could reproduce the exact same behavior you describe, and it happens when all options share the same value:

enter image description here

Hope it helps!

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .