How do I reset a specific input field, in this instance, title input field?
I know how to reset all fields (using form.resetFields()) but not a specific field on ant design
<Form.Item name='Title' label='Title'>
<Input value={title} onChange={handleChange('title')} />
</Form.Item>
<Form.Item name='Category' label='Category'>
<Select
placeholder='Select a category'
style={{ width: 420 }}
onChange={handleCategoryChange}
>
{categories.length > 0 &&
categories.map((c) => (
<Option key={c._id} value={c._id}>
{c.name}
</Option>
))}
</Select>
</Form.Item>
const handleCategoryChange = (e) => {
///reset Title field
};```
You are not showing the whole form, but since you are using form.resetFields() I am assuming that you are specifying some initialValues in your form tag. Let us say you have something similar to
const initValues = {
Title: "Foo",
Category: 123,
...
}
<Form
initialValues={initvalues}
...
/>
What form.resetFields() does is set all field values back to their initialValues. What you want, then, is to reset only the title field to its initial value.
This can then be accomplished by
const handleCategoryChange = (e) => {
form.setFieldsValue( { Title: initValues.Title } )
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With