function readOnly(count){ }
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
+ Start a Discussion
Phuc Nguyen 18Phuc Nguyen 18 

Multiple radio button groups in LWC

LWC renders first and last radio button groups fine but but none in between. If I reference 1 or 2 picklist group I am ok but 3 or more none of the picklist in in the middle render any values.
 
import { LightningElement,wire, track } from 'lwc';
import { getPicklistValues } from 'lightning/uiObjectInfoApi';
import { getObjectInfo } from 'lightning/uiObjectInfoApi';
import LEASE_OBJECT from 
'@salesforce/schema/Lease_Payment_Term__c';
import Accounting_Type from 
'@salesforce/schema/Lease_Payment_Term__c.Accounting_Type__c';
import Type__c from '@salesforce/schema/Lease_Payment_Term__c.Type__c';

export default class GetPickListValueInLWC extends LightningElement {

@track selectedValue;
@track options = [];
@track options1 = [];
@track options2 = [];

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

@wire(getPicklistValues, {
    recordTypeId: '$objectInfo.data.defaultRecordTypeId', fieldApiName : 
Accounting_Type
}) ATPicklistValues ({error, data}) {
    if(data) {
        let optionsValues = [];
        for(let i = 0; i < data.values.length; i++) {
            optionsValues.push({
                label: data.values[i].label,
                value: data.values[i].value
            })
        }
        this.options = optionsValues;
        window.console.log('optionsValues ===> '+JSON.stringify(optionsValues));
    }
    else if(error) {
        window.console.log('error ===> '+JSON.stringify(error));
    }
   }


@wire(getPicklistValues, {
    recordTypeId: '$objectInfo.data.defaultRecordTypeId',  
    fieldApiName : Type__c
}) TPicklistValues ({error, data}) {
    if(data) {
        let optionsValues = [];
        for(let i = 0; i < data.values.length; i++) {
            optionsValues.push({
                label: data.values[i].label,
                value: data.values[i].value
            })
        }
        this.options1 = optionsValues;
        window.console.log('optionsValues ===> 
'+JSON.stringify(optionsValues));
    }
    else if(error) {
        window.console.log('error ===> '+JSON.stringify(error));
    }
}

 @wire(getPicklistValues, {
     recordTypeId: '$objectInfo.data.defaultRecordTypeId', fieldApiName : Payment_Frequency
 }) TPicklistValues ({error, data}) {
     if(data) {
         let optionsValues = [];
         for(let i = 0; i < data.values.length; i++) {
             optionsValues.push({
                 label: data.values[i].label,
                 value: data.values[i].value
             })
         }
         this.options2 = optionsValues;
         window.console.log('optionsValues ===> '+JSON.stringify(optionsValues));
     }
     else if(error) {
         window.console.log('error ===> '+JSON.stringify(error));
     }
 }


HTML

<template>
<lightning-record-edit-form record-id={recordId} object-api-name="Lease_Payment_Term__c"
onsuccess={handleSuccess} onsubmit ={handleSubmit}>
<lightning-messages>
</lightning-messages>
<lightning-output-field field-name="Lease__c">
</lightning-output-field>
<lightning-input-field field-name="Name">
</lightning-input-field>
<lightning-radio-group name="ATradioGroup" if:true={wiredPicklistValues.data}
                      label="Accounting Type"
                      options={options}
                      value={value}
                      type="radio">
</lightning-radio-group>
<lightning-radio-group name="TradioGroup"
                      label="Type"
                      options={options1}
                      value={value}
                      type="radio">
</lightning-radio-group>
<lightning-radio-group name="PaymentradioGroup"
                      label="Payment Frequency"
                      options={options2}
                      value={selectedValue}
                      onchange={handleChange2}
                      type="radio">
</lightning-radio-group>

​​​​​​​
Best Answer chosen by Phuc Nguyen 18
David Zhu 🔥David Zhu 🔥
I noticed you use the same function name ATPicklistValues  for all three wire functions. Can you change them to ATPicklistValues1, ATPicklistValues2, and ATPicklistValues3?

All Answers

David Zhu 🔥David Zhu 🔥
You may check line 63:
 recordTypeId: '$objectInfo.data.defaultRecordTypeId', fieldApiName : Payment_Frequency    //I don't see payment_Frequence defined

I think you need to add import field line to the code to make the code work:: (assume field api name is Payment_Frequency__c)

import Payment_Frequency from '@salesforce/schema/Lease_Payment_Term__c.Payment_Frequency__c';   


Suggestion:
1.line 8 should be changed to make it consistent with other fields.  replace type__c by Type.

import Type from '@salesforce/schema/Lease_Payment_Term__c.Type__c';

2. Consequently line 43 should be changed to:
fieldApiName : Type
Phuc Nguyen 18Phuc Nguyen 18
David, 
I do have import Payment_Frequency just forgot to add it to post.  Updated based on your suggestion,  Do you see any other reasons why this is behaving the way it is?  
Thanks,
P
 
David Zhu 🔥David Zhu 🔥
do you get the value in the console log for line 74?

window.console.log('optionsValues ===> '+JSON.stringify(optionsValues));
 
Phuc Nguyen 18Phuc Nguyen 18
yes but not for line 54.  the second picklist
David Zhu 🔥David Zhu 🔥
1.line 8 should be changed to make it consistent with other fields.  replace type__c by PaymentType.

import PaymentType from '@salesforce/schema/Lease_Payment_Term__c.Type__c';   //make sure type__c is a valid picklist data type and the picklist values are avaible on the default record type

2. Consequently line 43 should be changed to:
fieldApiName : PaymentType
Phuc Nguyen 18Phuc Nguyen 18
Made update.  The odd think is, if I just have 2 picklist fields it works.  If I add a 3rd or more.  The one that previously(2nd) worked no longer populates but the last picklist that is in teh chain does. 
thanks
P
David Zhu 🔥David Zhu 🔥
I noticed you use the same function name ATPicklistValues  for all three wire functions. Can you change them to ATPicklistValues1, ATPicklistValues2, and ATPicklistValues3?
This was selected as the best answer
Phuc Nguyen 18Phuc Nguyen 18
That was it.  I had the 'TPicklistValues' listed for multiple wire functions.  Now I have another issue but I will post a new question.
thanks,
P