0

I have a lwc that is dynamically binding products to a checkbox group which was correctly displaying the data in the component. I tried adding the account name to the title of the lightning card that contains the checkbox group, but I can't get the account name to display. If I remove the checkbox group, the account name displays correctly. So, I can bind the products and account name independently, but as soon as I combine both, the account name doesn't display. I'm not sure what I'm missing.

    <template>
        <lightning-card  variant="Narrow" icon-name="standard:account">
            <h1 slot="title">List of Products for {name}</h1>
            <lightning-checkbox-group name="Active Product List"
                                            class="slds-box"
                                            label="Please select the active products for this account from the list below"
                                            options={products}
                                            value={value}
                                            onchange={handleChange}></lightning-checkbox-group>
            <p>Selected Values are: {selectedValues}</p>
        </lightning-card> 
    </template>
    import { LightningElement, wire, track } from 'lwc';
    import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
    import NAME_FIELD from '@salesforce/schema/Account.Name';
    import getProducts from '@salesforce/apex/AccountActiveProductsController.getProducts';

    export default class AccountActiveProducts extends LightningElement {
        value = []
        @track products = []
        recordId

        @wire(getProducts)
        wiredResult(result) {
            if(result.data) {
                var conts = result.data;
                for(var key in conts) {
                    this.products.push({ label:conts[key], value:key })
                }
            }
        }

        @wire(getRecord, { 
            recordId: "$recordId", 
            NAME_FIELD 
        })
        account;

        get name() {
            return getFieldValue(this.account.data, NAME_FIELD);
        }

        get selectedValues() {
            return this.value.join(',');
        }

        handleChange(e) {
            this.value = e.detail.value;
        }
    }

1 Answer 1

0

A few things I would address first:

  1. recordId should be an @api decorated property
  2. getRecord() is expecting a parameter named "fields". In the SFDC documentation, the property is not included because the variable name is the same so it's not necessary. In your case it's necessary.
  3. The fields parameter should be an array/list of fields
  4. Missing semi-colons may explain why it "works sometimes"

The following JS should work. Didn't test it with the Apex call:

import { LightningElement, api, wire, track } from 'lwc';
import { getRecord, getFieldValue } from 'lightning/uiRecordApi';
import NAME_FIELD from '@salesforce/schema/Account.Name';
import getProducts from '@salesforce/apex/AccountActiveProductsController.getProducts';

export default class AccountActiveProducts extends LightningElement {
    value = [];
    @track products = [];
    @api recordId;

    @wire(getProducts)
    wiredResult(result) {
        if(result.data) {
            var conts = result.data;
            for(var key in conts) {
                this.products.push({ label:conts[key], value:key });
            }
        }
    }

    @wire(getRecord, { 
        recordId: '$recordId', 
        fields: [NAME_FIELD]
    })
    account;

    get name() {
        return getFieldValue(this.account.data, NAME_FIELD);
    }

    get selectedValues() {
        return this.value.join(',');
    }

    handleChange(e) {
        this.value = e.detail.value;
    }
}

You must log in to answer this question.

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