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
    Oct 28 '20 at 14:58

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());

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.