I have a lightning component which holds multiple lightning:recordEditForm's populated in an aura:iteration.

<aura:iteration items="{!v.records.all}" var="record">
    <lightning:recordEditForm objectApiName="vp_Plan__c" recordId="{!record.Id}" aura:id="editForm" onsuccess="{!c.handleSuccess}">
        <div class="slds-grid slds-theme_default body">
            <div class="slds-col slds-size_1-of-7 UB">
            <div class="slds-col slds-size_1-of-7 currency">
                <span><lightning:inputField required="true" aura:id="required" fieldName="vp_Revenue__c" variant="label-hidden"/></span>
            <div class="slds-col slds-size_1-of-7 currency">
                <span><lightning:inputField required="true" aura:id="required" fieldName="vp_Margin__c" variant="label-hidden"/></span>
            <div class="slds-col slds-size_1-of-7 currency">
                <span><lightning:inputField disabled="true" aura:id="calc" fieldName="vp_Result__c" variant="label-hidden"/></span>

A save button calling controller function saveRecord:

<lightning:button label="Speichern" onclick="{!c.saveRecords}" aura:id="saveButton" variant="brand" disabled="false"/>   

And the controller function saveRecords, which does some validations and fires submit for all forms:

saveRecords : function(component, event, helper) {
        var saveButton = component.find("saveButton");
        // get required fields with aura:id "required"
        var reqRecords = component.find("required");
        var errorCount = 0;

        // validation of individual field values
            var recVal = record.get("v.value");
            // check for empty fields
            if(recVal == null || recVal == 0 || recVal == ''){
                $A.util.addClass(record, 'slds-has-error');
            else {
                $A.util.removeClass(record, 'slds-has-error');
        // no error submit form(s)
            // get all lightning:recordEditForm with aura:id "editForm"
            var editForms = component.find('editForm');
            // in case a single form is returned, instead of an array
            var forms = [].concat(editForms || []);
            // submit each form 
            forms.forEach(form =>{
                // e.g.:
                // form["vp_Result__c"] = form["vp_Revenue__c"] * form["vp_Margin__c"]
                "variant": "success",
                "title": "Sucess!",
                "message": "All good!",
                "duration": "5000",
                "mode": "pester",
        // error message
        else { 
                    "variant": "error",
                    "header": "Missing entries!",
                    "message": "Not saved!",
                    "mode": "sticky",

I need to calculate a "Result" of the two fields "Revenue" and "Margin" before save, but I don't manage to access the field values.

I have tried component.find("editForm").getElement().childNodes; / component.find("editForm").getElement() which doesn't work due to the invalid DOM access and form["vp_Result__c"]which is undefined.

Any idea how two identify the correct set of "revenue", "margin" and "result" fields within the same record form?

Thanks for any input.

Best, Raphael

1 Answer 1


When you iterate make sure the aura:id is a unique value. Then you can get the value. Follow a convention when generating the ID as part of the iteration and then if you need to loop through all the form fields you can catch the fields that follow the pattern.

i.e. aura:id = "balance1", aura:id="balance2" etc....

Find by aura:id1

You must log in to answer this question.

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