[SalesForce] Opportunity Product Quick Action Aura component with recordEditForm and inputField on lookup not displaying input fields when creating a record

Problem overview:

  • I want to create a new record using a Quick Action (on Opportunity Layout for a new Opportunity Product) using lightning:recordEditForm.
  • The component recordEditForm has lightning:inputFields for lookup fields Opportunity and Product.
  • It also has lightning:inputFields for Quantity and UnitPrice.
  • My client's org is Professional Edition (which means no Apex code!)

UPDATE: I found one error in my component. The OpportunityId will not be set correctly by using {!v.recordId} – that's going to be the Id of the OpportunityLineItem record (and it doesn't exist yet …). It is getting set correctly from the Opportunity.

The thing is: When I click on the Opportunity Quick Action, NONE of the input fields show up in the panel. The recordEditForm is completely empty – I verified this by dumping the form values using an event handler for onsubmit.

Component markup:

<aura:component implements="flexipage:availableForAllPageTypes,force:lightningQuickActionWithoutHeader,lightning:actionOverride,force:hasRecordId" 
access="global">

    <!--  Lightning action on the opportunity object. Clicking the Component's action button on the Oppty layout opens a panel to create a new Oppty Line Item.  -->

    <aura:handler name="init" value="{!this}" action="{!c.handleLoad}" /> 

    <lightning:recordEditForm aura:id="recordEditForm"
                           objectApiName="OpportunityLineItem" 
                           onsubmit="{!c.handleLoad}" >
        <lightning:messages />

        <lightning:inputfield aura:id="opportunityProductField" fieldname="OpportunityId" value="{!v.recordId}" 
                              disabled="false" required="true"/>
        <lightning:inputfield aura:id="opportunityProductField" fieldname="Product2Id" disabled="false" required="true"  />
        <lightning:inputfield aura:id="opportunityProductField" fieldname="Quantity" />

        <lightning:inputfield aura:id="opportunityProductField" fieldname="UnitPrice" />

        <lightning:button class="slds-m-top_small" type="submit" label="Submit" />

    </lightning:recordEditForm>

</aura:component>

Client controller:

({
    handleLoad: function (cmp, event, helper) {

        var obj = cmp.find("recordEditForm");
        console.log(JSON.stringify(obj));
    }
})  

The Quick Action LX Component when it renders:

The Quick Action LX Component


Of course, the record is not going to save if the fields are empty, and here is the message when I click 'Submit':

"An error occurred while trying to update the record. Please try again.

Required fields are missing: [OpportunityId, Quantity]"

Any assistance would be appreciated. Some of the of SFSE posts mentioned that record creation doesn't work well in LX component lightning:RecordEditForm.

Another post indicated that the inputFields must be populated with default values.

Best Answer

All your code looks fine but fieldname in below line should be fieldName and it will work fine.

Wrong:-

<lightning:inputfield aura:id="opportunityProductField" fieldname="OpportunityId" value="{!v.recordId}" disabled="false" required="true"/>

correct:-

<lightning:inputfield aura:id="opportunityProductField" fieldName="OpportunityId" value="{!v.recordId}" disabled="false" required="true"/>

you need to change in every input field.

Related Topic