Sometimes we can have a requirement to add or modify field values in onsubmit
event of lightning:recordeditform
. In below example, I’m creating “Lead” object record using lightning:recordeditform
and in onsubmit event, I’m adding “Description” field value of “Lead” object.
Lightning Component:
<!--Sample.cmp--> <aura:component implements="flexipage:availableForAllPageTypes,force:appHostable"> <!--Component--> <div class="slds-m-around--xx-large"> <lightning:card title="Lead" iconName="standard:lead" class="slds-p-around_medium"> <lightning:recordEditForm aura:id="leadCreateForm" objectApiName="Lead" onsubmit="{!c.handleOnSubmit}"> <lightning:messages /> <div class="slds-grid"> <div class="slds-col slds-size_1-of-2 slds-p-around_medium"> <lightning:inputField fieldName="FirstName"></lightning:inputField> </div> <div class="slds-col slds-size_1-of-2 slds-p-around_medium"> <lightning:inputField fieldName="LastName"></lightning:inputField> </div> </div> <div class="slds-grid"> <div class="slds-col slds-size_1-of-2 slds-p-around_medium"> <lightning:inputField fieldName="Email"></lightning:inputField> </div> <div class="slds-col slds-size_1-of-2 slds-p-around_medium"> <lightning:inputField fieldName="Phone"></lightning:inputField> </div> </div> <div class="slds-grid"> <div class="slds-col slds-size_1-of-2 slds-p-around_medium"> <lightning:inputField fieldName="Company"></lightning:inputField> </div> </div> <lightning:button type="submit" label="Save" variant="brand"/> </lightning:recordEditForm> </lightning:card> </div> </aura:component>
Lightning JS Controller:
({ handleOnSubmit : function(component, event, helper) { event.preventDefault(); //Prevent default submit var eventFields = event.getParam("fields"); //get the fields eventFields["Description"] = 'Lead was created from Lightning RecordEditForm'; //Add Description field Value component.find('leadCreateForm').submit(eventFields); //Submit Form } })