'Reset form using AvForm in react js
I am using AvForm in React js. I want to reset the form after form Submission. But I am unable to reset the code unless I refresh the whole page. Whenever the form submits it retains the old value but not reset the fields
form.js
<AvForm
className="form-horizontal"
onValidSubmit={(e, v) => {
const data = { ...formData, ...v };
setFormData({ ...data });
dispatch(
createMarketplaceAccount(
{
name: data.name,
access_id: data.access_id,
access_secret: data.access_secret,
marketplace: "amazon",
aws_credentials: {
marketplaces: data.marketplaces.split(","),
},
account_id: getUserInfo().account_id,
informed_api_key: data.informed_api_key,
},
),
);
toggleTabProgress(3);
toggleTab(3);
}}
>
<div className="form-group">
<AvField
name="access_id"
label="Amazon Seller ID:"
value=""
className="form-control"
placeholder="ABC123DE456F78"
type="text"
required
/>
</div>
<div className="form-group">
<AvField
name="access_secret"
label="MWS Auth Token:"
value=""
className="form-control"
placeholder="amzn.mws.123e4567-e89b-12d3-a456-426655440000"
type="text"
required
/>
</div>
<ul className="pager wizard twitter-bs-wizard-pager-link">
<li
onClick={() => {
toggleTabProgress(1);
}}
className="btn btn-primary w-md btn-sm waves-effect waves-light"
>
Previous
</li>
<li className={activeTabProgress === 4 ? "next disabled" : "next"}>
<button type="submit" className="btn btn-primary w-md btn-sm waves-effect waves-light">
Next
</button>
</li>
</ul>
</AvForm>
I need help. Thank you in advance. I need some suggestions
Solution 1:[1]
Hassam use the concept of states and set the state to empty whenever it is required and assign that state to the value property of field
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | Haroon Fayyaz |
