other-emerald
other-emerald2y 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.ai2y 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.ai2y 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.ai2y ago
<@968759185992986674> kapa.ai is still learning and improving, please let us how it did by reacting below
other-emerald
other-emerald2y 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
stormy-gold
stormy-gold17mo 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/
other-emerald
other-emerald17mo ago
ahh! great thankyou! @alicanerdurmaz
stormy-gold
stormy-gold17mo ago
i'm glad to hear that 🙏
adverse-sapphire
adverse-sapphire17mo ago
Hello @ben_g. , did running codemod on your project fixed your issue?
other-emerald
other-emerald17mo 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
adverse-sapphire
adverse-sapphire17mo ago
Thanks @ben_g. , we are looking forward!