mymth / vanillajs-datepicker

A vanilla JavaScript remake of bootstrap-datepicker for Bulma and other CSS frameworks
MIT License
720 stars 147 forks source link

Datepicker does not update variable value in Vue v-model #109

Open ziorufus opened 2 years ago

ziorufus commented 2 years ago

I see some other users ask for stuff related to Datepicker and Vue, therefore I think I'm doing something wrong. I'd like to use the Datepicker in my app, but it seems that the two-ways binding of Vue does not work with it.

This is a minimal example showing the issue: https://jsfiddle.net/cjht6fkn/8/

If I edit the input box directly, I can see that the Vue variable changes its value consequently. If I edit the input value using the calendar, the value in the Vue variable does not update.

mymth commented 2 years ago

It looks like the two-way binding is done by monitoring the input event on bound <input> element. When the value of an element is changed by a program, browser doesn't fire this kind of events (change is another one). You need to update the model's data yourself using datepicker's changeDate event.