harsh-harlequin
harsh-harlequin15mo ago

It seems there is not an onClear available in the "@pankod/refine-antd" Input

Heey Team, First off love your work and thank you for making such a great product. Can I ask why does the onClear prop not exist on the Input component in Ant Design for React, while it does exist on the Select component? The Input has the allow clear so it would seem like it should exist Im using "@pankod/refine-antd": "^3.48.10", "@pankod/refine-core": "^3.74.6", Is there a recommended way to handle clearing of input values in Ant Design forms?"
No description
10 Replies
kapa.ai
kapa.ai15mo ago
Hey @ben_g.! I'm the kapa.ai support bot. I've searched through the docs to try to answer your question. :wave:
kapa.ai
kapa.ai15mo ago
---------------------- It looks like the onClear prop is not available on the Input component in @pankod/refine-antd version 3.48.10. However, you can use the resetFields method from the useForm hook to clear the input values in Ant Design forms. Here's an example of how to use resetFields:
import { useForm } from "@pankod/refine-antd";

const { formProps, resetFields } = useForm<IFormValue>();

// ...

<Button onClick={() => resetFields()}>Clear Form</Button>
import { useForm } from "@pankod/refine-antd";

const { formProps, resetFields } = useForm<IFormValue>();

// ...

<Button onClick={() => resetFields()}>Clear Form</Button>
For more information, please refer to the useForm API Reference (https://refine.dev/docs/api-reference/antd/hooks/form/useForm) and the Ant Design Form Documentation (https://ant.design/components/form/). ----------------------
useForm | refine
useForm is used to manage forms. It returns the necessary properties and methods to control the Antd Form. Also, it has been developed by using useForm imported from @refinedev/core package.
kapa.ai
kapa.ai15mo ago
<@968759185992986674> kapa.ai is still learning and improving, please let us how it did by reacting below
harsh-harlequin
harsh-harlequin15mo ago
I already have the allowClear prop available, so clearing the input is not the issue. Once i use the clear prop i actually want to do something. The select has this facility available and the allowClear prop
exotic-emerald
exotic-emerald15mo ago
https://4x.ant.design/components/input/#api it seems <Input> does not have onClear prop on v4. you can update antd with this guide https://refine.dev/docs/api-reference/antd/migration-guide/v4-to-v5/
harsh-harlequin
harsh-harlequin15mo ago
ahh! great thankyou! @alicanerdurmaz
exotic-emerald
exotic-emerald15mo ago
i'm glad to hear that 🙏
afraid-scarlet
afraid-scarlet15mo ago
Hello @ben_g. , did running codemod on your project fixed your issue?
harsh-harlequin
harsh-harlequin15mo ago
Hey @batuhanw I haven't run it yet. But I actually didn't think to check if the latest version had it. So knowing that really helped me. I'll let you know how I go
afraid-scarlet
afraid-scarlet15mo ago
Thanks @ben_g. , we are looking forward!