0

In JavaScript (jQuery for example), we can return false to halt the form submission from happening under specific condition(s). I tried doing this in my Lightning Web Component in the method tied the onsubmit, but the submit executes anyway. How do we halt submission in LWC?

Markup

<lightning-record-edit-form onsubmit={OnSubmitImpl} ...

JS

OnSubmitImpl() {

   // Halt condition check
   if (...) {

      // Stop the form from submitting
      return false;

   }

}
  • FYI - I just tried throw "Blah Blah" which also does not work. – Mr. B Sep 11 '19 at 23:07
2

Certainly with lightning-record-form (and I presume for the edit variant) you can provide an onsubmit handler:

<lightning-record-form
    object-api-name="MyObjectType__c"
    layout-type="Full"
    mode="edit"
    onsubmit={handleFormSubmit}
    onsuccess={handleFormSuccess}
    onerror={handleFormError}
    oncancel={handleFormCancel}>
</lightning-record-form>

This function must actually stop the event propagation, apply whatever it needs to do and then (potentially conditionally) request the continuation of the submission process by invoking the submit function on the lightning-record-form instance itself. To stop the submission, just don't call submit. This example doesn't show conditionally calling submit, but does show how you get the fields to inspect/update and pass on through:

handleFormSubmit(event) {
    event.stopPropagation();

    // This must also suppress default submit processing
    event.preventDefault();

    // Set default values of the new instance.
    let fields = event.detail.fields;
    fields.SomeFieldToChange__c = this.someValue;
    fields.SomeOtherField__c = this.someOtherValue;

    // Push the updated fields though for the actual submission itself
    this.template.querySelector('lightning-record-form').submit(fields);
}
  • Thanks Phil. stopProagation and preventDefault did the trick. – Mr. B Sep 12 '19 at 16:00

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.