-3

I have a modal with a lightning-record-edit-form and I want to show a spinner as soon as the Save button is clicked, keeping it consistent with how it is in standard Salesforce.

I have an onclick handler on the Save button to show the spinner and I remove it as soon as it enters the onsuccess or onerror handler.

However, there's an issue when there are form validity errors, then, the spinner never gets removed. Ideally, I'd need an oninvalid handler on the form itself or something, but the lightning-record-form variations don't have that method.

Then, I tried to manually check whether the fields are valid, but lightning-input-field doesn't have a checkValidity method. I know it's just using lightning-input under the hood, but I can't seem to access those elements with this.template.querySelector (or with document if that even works).

So my question is: Can we somehow manually check for validation in a lightning-record-form or a variation on the form?

4
  • Check if this answers you question - salesforce.stackexchange.com/questions/234487/… Jul 25 at 10:07
  • Validity is not supported for lightning-input-field, refer the above answer to get some perspectives on how to approach custom validations for lightning-input-field Jul 25 at 10:07
  • @prabuddhkumar It doesn't because the answer there is to do the validation logic manually in js, which is obviously not something I'm going to do / maintain / ...
    – vince
    Jul 25 at 10:18
  • ok, how did you deduce that it's due to "form validity errors", could you add the error/screenshot/example ? Jul 25 at 11:01

1 Answer 1

0

Use the onerror attribute of your lightning-record-edit-form to stop the spinner.

HTML

.......
.......
<!-- Loading Spinner-->
<template if:true={loading}>
    <lightning-spinner alternative-text="Loading..." size="medium"></lightning-spinner>
</template>
......
<lightning-record-edit-form onerror={handleError}
......
......

JS

loading = false;
......
......
handleError(evt){
    this.loading = false;
}
......
7
  • I'm already using onerror and it's working for the back-end validation. I'm referring to the front-end form validation here.
    – vince
    Jul 25 at 10:16
  • In other words, front-end form validation errors don't trigger the onerror method.
    – vince
    Jul 25 at 10:19
  • You may have to edit your question to add more details to code specifying the issue.
    – Raul
    Jul 25 at 10:40
  • @vince what kind of front-end validation you have? It would be best to add them in your question. Jul 25 at 10:46
  • It's just the standard lightning-record-form functionality.
    – vince
    Jul 25 at 10:49

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.