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