function readOnly(count){ }
Sign Up ›
Starting November 20, the site will be set to read-only. On December 4, 2023,
forum discussions will move to the Trailblazer Community.
Learn More

Browse by Topic
ShowAll Questionssorted byDate Posted
+ Start a Discussion
AJAYAJAY 

Lwc embedded in aura component which is kept in quick action.

I have a object A and object B. B object has a field which is a lookup to object A.


Now as they are related, under records of object A i have object b records as related list.

Now what i want to achieve is i want to create a quick action on record A. I kept a quick action which is a lightning component with LWC embedded into it.

Now upon clicking quick action, i want to show the details of the record of object A + LWC(record details of object B).

Imagine. Object A is account and object B is custom object x__c and has fields example1, example2

It should look Like below: account information + input fields of object x__c.
Account info:
Account name: abc
Account address: xyz
Account phone: 123
X__c info:
example1(to be input):
​​​​​​​​​​​​​​example2(to be input):
​​​​​​


Is it possible ?
Abdul KhatriAbdul Khatri
Hi AJAY

Any reason to do that, even you have an option to add a new record directly from the account.

But anyway here is the code, I used Contact which you can replace with your custom object

Lightning web component
html file 
<template>
    <lightning-record-view-form 
        record-id={recordId}
        object-api-name="Account">
        <div class="slds-page-header">
            <p class="slds-text-heading_small">Account Info</p>
        </div >        
        <div class="slds-grid">
            <div class="slds-col slds-size_1-of-2">
                <lightning-output-field field-name="Name"></lightning-output-field>
                <lightning-output-field field-name="BillingAddress"></lightning-output-field>                
            </div>
            <div class="slds-col slds-size_2-of-2">            
                <lightning-output-field field-name="Phone"></lightning-output-field>
            </div>
        </div>
    </lightning-record-view-form>
    <lightning-record-edit-form object-api-name="Contact" onsuccess={handleContactCreated}>  
        <div class="slds-page-header">
        <p class="slds-text-heading_small">Contact Add</p>
        </div >
        <div class="slds-grid">
            <div class="slds-col slds-size_1-of-1">
                <lightning-input-field field-name=AccountId value={recordId}></lightning-input-field>
                <lightning-input-field field-name=LastName></lightning-input-field>
            </div>
         </div>
        <lightning-button type="submit" variant="brand" label="Create Contact"></lightning-button>
    </lightning-record-edit-form>    
</template>

js file 
import { LightningElement, api } from 'lwc';
import { ShowToastEvent } from 'lightning/platformShowToastEvent';

export default class AccountContactView extends LightningElement {

    @api recordId;


    handleContactCreated() {
        this.dispatchEvent(
            new ShowToastEvent({
                title: 'Info Message',
                message: 'Contact Added Successfully.',
                variant: 'Info'
            })
        );      
    }
}

In order to make it work on the Quick Action Button you need to create an aura component and reference the above LWC. Unfortunately as per my knowledge this is the only way to do that. Currently with LWC it is not available

Create an aura component and reference like this
accountContactView is the name of my above LWC component 
<aura:component implements="flexipage:availableForAllPageTypes, force:hasRecordId, force:lightningQuickAction">
    <c:accountContactView recordId="{!v.recordId}" />
</aura:component>
I hope this help