0

There is Contact object as parent object and I have created a custom object called Vaccination_Information__c which is a child of Contact object.

I want to include the contact name field from Contact object in Vaccination_Information__c object lightning record form that I have created using LWC. How should I import it in the JS file?

Below is the code line that I have written but shows error:

import CONTACTNAME_FIELD from '@salesforce/schema/Vaccination_Information__c.Contact__c';

where Contact__c is the api name for the master detail relationship. and the error is:

Invalid reference Vaccination_Information__c.Contact__c of type sobjectClass in file vaccineReg.js

1 Answer 1

0

lightning-record-edit-form does not allow you to display the parent field directly. In order to use them on child object lightning record form, You need to do something like this:-

  • Use nested record edit form outer one for child and inner one for parent

  • define a onload handler of the child and fetch the parent record id

  • pass the fetched parent record id to parent record edit form to load parent record

  • on click of submit, save both the form programmatically

     <lightning-record-edit-form object-api-name={objectApiName} record-id={recordId} onload={handleLoad}>
         <lightning-input-field field-name="Name"></lightning-input-field>
         <lightning-input-field field-name="AccountId"></lightning-input-field>
         <!--Account field starts from here-->
         <lightning-record-edit-form object-api-name="Account" record-id={accId}>
             <lightning-input-field field-name="Type"></lightning-input-field>
         </lightning-record-edit-form>
         <!--submit button to save both account and contact-->
         <div class="slds-var-m-top_medium">
             <lightning-button variant="brand" label="Save" onclick={handleSubmit}>
             </lightning-button>
         </div>
     </lightning-record-edit-form>
    

JS File:-

    accId;
    // Flexipage provides recordId and objectApiName
    @api recordId;
    @api objectApiName;

    handleLoad(event) {
        var record = event.detail.records;
        var fields = record[this.recordId].fields;
        this.accId = fields.AccountId.value;
    }

    handleSubmit() {
        this.template.querySelectorAll('lightning-record-edit-form').forEach(element => {
            element.submit();
        });
    } 

When i added the component on child record page, it comes with both parent and child record fields enter image description here

You must log in to answer this question.

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