Topic: How to reset the MDBSelect while resetting the form using formik in react
vberkmans pro asked 4 years ago
While resetting the formik form in react, MDBSelect is not getting reset. Previously selected value is displayed in the dropdown. But the values of that is assigned as empty. Please check and let me know how to reset the MDBselect.
mgtripoli pro answered 4 years ago
Rather than destroying it, a much more simple approach would be attaching the key parameter to the MDBSelect component. The key could be the state of the selected value. Essentially, once the key changes, the component will be forced to unmount, then remount.
Here is a rough example using hooks. You will have to fill in additional logic to make it work.
const [selectedDrowndownVal, setSelectedDropdownVal] = useState(initialSelection);
const onDropdownSelect = key => {
setSelectedDropdownVal(key[0]);
}
<MDBSelect
key={selectedDrowndownVal}
options={YOUR_OPTIONS}
selected={selectedDrowndownVal}
label="Select a Value"
getValue={onDropdownSelect}
/>
mgtripoli pro commented 4 years ago
I have noticed this workaround also will help people when using MDBDatePicker
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Resolved
- ForumUser: Pro
- Premium support: No
- Technology: MDB React
- MDB Version: 4.23.1
- Device: Desktop
- Browser: Chrome
- OS: Windows
- Provided sample code: No
- Provided link: No
Piotr Glejzer staff commented 4 years ago
Did you try destroy it and attach a new one?