Topic: Vue Date Picker - events on cancel, ok and clear buttons
Expected behavior When the OK button or Cancel button is clicked an event is raised.
Actual behavior No events are raised (according to documentation) other then a "close" event. This is not enough to know if the user actually intended to change the data. When the date picker is closed because the user clicks in the area next to the picker, the picker is closed and the date is set to the date selected at that moment.
Solution: *Only set the date when the user clicks "OK". *Emit events on clicks on "OK" and "Cancel" -> this would allow us to do our own interpretation.
Resources (screenshots, code snippets etc.)
https://mdbootstrap.com/docs/vue/forms/date-picker/#docsTabsAPI
FREE CONSULTATION
Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.
Opened
- ForumUser: Premium
- Premium support: Yes
- Technology: MDB Vue
- MDB Version: 6.7.0
- Device: PC
- Browser: Chrome
- OS: Windows 10
- Provided sample code: No
- Provided link: Yes
Mikołaj Smoleński staff commented 3 years ago
Each date change emits
changeevent. Adding an event listener forchangeevent will allow you to always have the current picker selection. Doesn't that fix the problem? Best regardshello@33reasons.be premium commented 3 years ago
Thanks, but that doesn't help. The idea is that when a user clicks outside of the date picker to close it, we assume the user wanted to cancel the action and the date should not be changed. So we need to know if the picker closed because of the user clicking on "OK" or because of clicking outside the picker (in that case we should discard the date set in the date picker).
Mikołaj Smoleński staff commented 3 years ago
Unfortunately, we treat the moment of choosing a date or using the
clearbutton as a change of value, so we do not emit additional events when theOKbutton is clicked. In fact, closing the picker window does not clear the value (as it was set manually first).Best regards