Could you please tell me how to make a field required dynamically?
I have two fields firstName
and lastName
. First name is required. I want lastName
to become a required field if I type test
in firstName.
Is it possible?
Here is my code https://codesandbox.io/s/unruffled-pike-5k7jn
<Field
name="lastName"
validate={values.firstName === "test" ? required : ""}
>
{({ input, meta }) => (
<div>
<label>Last Name</label>
<input {...input} type="text" placeholder="Last Name" />
{meta.error && meta.touched && <span>{meta.error}</span>}
</div>
)}
</Field>
Can I make the second field required only if user types test
in first name field?
API link
https://final-form.org/docs/react-final-form/examples
To see it not working reproduce these steps:
1) click submit button. It shows firstname is required.
2) enter test text in first name field.
3) press submit button again.
It is not showing required error. Why?