Version: 4.xx.xx
Custom Form Validation
In refine, we can use the form validation that comes with Ant Design
with the rules property of the Form.Item component.
<Form>
<Form.Item
label="Title"
name="title"
rules={[
{
required: true,
},
{
min: 5,
},
]}
>
<Input />
</Form.Item>
...
</Form>
In addition to pre-defined rules, we can also prepare custom rules with the validator function.
Example
Now let's prepare a rule that checks if the titles of the posts are unique. We have an endpoint like the below. We will do the uniqueness check here.
https://api.fake-rest.refine.dev/posts-unique-check?title=Example
{
"isAvailable": true
}
localhost:3000/posts/create
important
Value must be kept in the state.
<Input onChange={(event) => setTitle(event.target.value)} />