foreign-sapphire•2y 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?"

10 Replies

kapa.ai•2y 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•2y 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•2y ago

<@968759185992986674> kapa.ai is still learning and improving, please let us how it did by reacting below

foreign-sapphire•2y 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

optimistic-gold•2y 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/

foreign-sapphire•2y ago

ahh! great thankyou! @alicanerdurmaz

optimistic-gold•2y ago

i'm glad to hear that 🙏

extended-salmon•2y ago

Hello @ben_g. , did running codemod on your project fixed your issue?

foreign-sapphire•2y 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

extended-salmon•2y ago

Thanks @ben_g. , we are looking forward!