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.

Piotr Glejzer staff commented 4 years ago

Did you try destroy it and attach a new one?

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

Please insert min. 20 characters.


Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.



Specification of the issue

  • 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