3

I'm trying to do some custom validation on submit for a Lightning Web Component. I'm trying to use the setErrors method for a lightning-input-field (https://developer.salesforce.com/docs/component-library/bundle/lightning-input-field/specification) and nothing seems to be happening.

Does anyone have any examples of how I can get the error message to show or know where I can find one?

handleSubmit(events){
    let f = this.template.querySelector('.myInputField');
    f.setErrors('error message');
    f.reportValidity();
}
Improve this question
0

3 Answers 3

Reset to default
3

For field "AccountId" you can use this object hierarchy to set error to lightning-input-field.

handleSubmit(events){
  let f = this.template.querySelector('.myInputField');
  f.setErrors({'body':{'output':{'fieldErrors':{'AccountId':[{'message':'Error'}]}}}});
}
Improve this answer
3
  • Thank you! Your solution helped me to solve my issue.
    – Kate Fedchenko
    Commented Sep 26, 2022 at 13:43
  • This is a very useful find! To take this one step further, use a more specific querySelector in order to target a specific field: let inputField = this.template.querySelector('[field-name="FIELD_API_NAME"]');
    – Ben Mitchell
    Commented Dec 6, 2022 at 19:14
  • At UI level it works, but when in handler we use reportValidity method before saving user input, it return false, so there is no point of using this solution to report error. These error are not detected by reportValidaity. It return false. If same used with lightning-input, return true.
    – Ankuli
    Commented Nov 29, 2023 at 18:47
2

The description for the method setErrors on lightning-input-field mentions:

Reserved for internal use.

I would imagine we cannot use any such attribute/method if it is reserved for internal use.

Improve this answer
5
  • You are correct, I just missed that part when I was reading it.
    – aaron
    Commented Apr 18, 2019 at 17:57
  • @aaron It’s really easy to miss. I figured it out only when came across your question :)
    – Jayant Das
    Commented Apr 18, 2019 at 22:56
  • While the documentation does say it is a method reserved for internal use, it's access is still marked as global. I don't particularly understand why they do this in the documentation, but developers can still call and use the functionality if used correctly. See the answer & replies here salesforce.stackexchange.com/a/381414/63755
    – Ben Mitchell
    Commented Dec 6, 2022 at 19:17
  • I think the concern about what Reserved for internal use means is that Salesforce isn't promising it's stable. If it means the method may become unavailable or change in some way, it would be "at your own risk" to choose to use it. It might also just mean that "you gotta use it internally, i.e. in the JS with a querySelector", but in that case I would expect the clean and focus method descriptions to be the same. Unless they simply never bothered to give them a proper description. Until someone can prove what it means, I'd definitely assume it means "use at your own risk"!
    – D. Salvadori
    Commented Oct 13, 2023 at 9:14
  • Confirmed it: help.salesforce.com/s/… "attributes and methods are marked “Reserved for internal use”, and their implementation can change at any time". So yeah, it may work for now. It may work forever. It may break tomorrow!
    – D. Salvadori
    Commented Oct 13, 2023 at 9:18
0

You may want to use 'reportValidity()' of input-field. It should allow you to show error message if input is invalid.

Improve this answer

You must log in to answer this question.

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