I have a requirement where we need to submit multiple record edit form data on single custom button click. Below is my approach for the requirement. I need to save the record edit form data on click of submit button which is external button. Could someone please help me on this?

<template for:each={testData} for:item="qli">
    <div class="slds-box">
        <lightning-output-field field-name="Name__c"></lightning-output-field>
        <lightning-output-field field-name="test__c"></lightning-output-field>
        <lightning-output-field field-name="test12__c"></lightning-output-field>
        <lightning-input-field field-name="test123__c"></lightning-input-field>
    </lightning-record-edit-form><br key={qli.id}/>  

<button class="slds-button slds-button_brand" onclick={submitDetails} title="OK">Submit</button>
  • Add type="submit" for button it'll implicitly will consider submit event.
    – Ysr Shk
    Commented Oct 28, 2020 at 14:58

1 Answer 1


Note: You should not be using the record edit form in bulk, as it will have severe performance penalties compared to using a custom Apex method to insert/update the records (literally over 400 times (49,000+%) slower if more than five items are in the list).

That said, you would need to call submit on each form:

[...this.template.querySelectorAll('lightning-record-edit-form')].forEach(form => form.submit());

You must log in to answer this question.

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