The lightning-record-edit-form has a documented submit
method that I assume can produce similar behavior to a click on a nested submit button. But I can't find any examples of this.
The documentation describes a fields
argument for the submit
method of:
Submits the form using an array of record fields or field IDs. The
field ID is provisioned from @salesforce/schema/. Invoke this method
only after the load event.
When no argument is supplied to submit
, features like required field validation does not work. I'm not in a position to test right now so am wondering:
- If the fields are hard-coded as the
submit
argument, does the expected behavior result? - Can the field names specified in the nested
lightning-input-field
elements be programmatically obtained? (I note thatlightning-record-edit-form
has afield-names
property but that is documented as "Reserved for internal use. Names of the fields to include in the form.".)
Best Answer
I have run into this often since moving from Aura to lightning web components (LWC) and have found that the only solution is to hide a submit button on the form, and then call click on it from your JS method when desired.
A very basic example of this would look like this:
HTML
JS
}
CSS
in this example, a simple click of the external button will submit this form programatically by locating the button on the form and clicking it.
In Aura
lightning:recordEditform
, you used to be able to set an aura:id on the form and simply callsubmit
from your JS, but that doesn't work in the new LWClightning-record-edit-form