0

I am trying to displaying controlling picklist values and dependent picklist values using lwc.

Fruit - Apple ,Orange, Grapes

Vegetables - Potato,onion,tomato

grains - rice,wheat, maize

Using the below code, it is getting displayed as

Fruit - Apple ,Orange, Grapes

Vegetables - Apple ,Orange, Grapes

grains - Apple ,Orange, Grapes

That is because of this line in JS code

this.TypeItemsFieldInfoOptions = this.TypeItemsFieldData.values.filter(opt => opt.validFor.includes(0));

It is getting only the values in array 0 and displaying in the picklist. How to resolve this issue?

JS code

export default class PicklistValuesLoadSheet extends LightningElement {
    @track value;
    @track TypeItemsFieldInfoOptions;

    @wire(getObjectInfo, { objectApiName: TYPEITEMS_OBJECT })
    objectInfo;

    @wire(getPicklistValues, { recordTypeId: '$objectInfo.data.defaultRecordTypeId', 
        fieldApiName: TYPEITEMS_FIELD})
    TypeItemsFieldInfo({ data, error }) {
        
            if (data) {
                this.TypeItemsFieldData = data;
                this.TypeItemsFieldInfoOptions = this.TypeItemsFieldData.values.filter(opt => opt.validFor.includes(0));
            }
        
    }

    @wire(getPicklistValues, { recordTypeId: '$objectInfo.data.defaultRecordTypeId', fieldApiName: TYPE_FIELD})
    TypePicklistValues;

}

HTML

<template>
    <lightning-card >
    <template if:true={TypePicklistValues.data}>
        <template for:each={TypePicklistValues.data.values} for:item="item">
            <p key={item.value}>{item.value}</p>
            <template for:each={TypeItemsFieldInfoOptions} for:item="item">
            <lightning-input
                key={item.value}
                label={item.label}
                data-value={item.value}
                type="checkbox"
                ></lightning-input>
            </template>
        </template>
    </template>
    </lightning-card>
</template>


0
2

Use the current index:

this.TypeItemsFieldInfoOptions = this.TypeItemsFieldData.values.filter(
  (opt,idx) => opt.validFor.includes(idx)
);
3
  • Thank you! But how will we get the current index?
    – Priya
    Oct 27 '20 at 2:39
  • @PriyaArun The second parameter to the Array.prototype.filter callback is the index of the current element you're checking for. Example is in the answer.
    – sfdcfox
    Oct 27 '20 at 2:40
  • Sorry I am pretty new to javascript. But how are we passing the index of the current element ?
    – Priya
    Oct 27 '20 at 2:46

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.