Custom error message for FieldError

Hi just wondering how to customize the required field error message?

This is what I have at the moment:

<Label name="name" errorClassName="error">Name</Label>
<TextField name="name" validation={{ required: true }} errorClassName="error"  />
<FieldError name="name" className="error" />

I tried to get the errors using the useForm hook

const { errors } = useForm()

And then display custom error message like this:

{errors.name && <span>Please enter your name</span>}

But it doesn’t seem to work

1 Like

In your TextField validation property, try changing the required field from true to your custom error message:

<TextField name="name" validation={{ required: "Please enter your name" }} errorClassName="error"  />
4 Likes

Awesome that worked thanks!

2 Likes