vuejs-datepicker with required attribute gets submitted without value

Viewed 5587
4 Answers

You can use input-attr to set the required attribute like :input-attr="{required: 'true'}"

A non-Vue datepicker library flatpickr also has this problem. I managed to resolve it by allowing user input (typeable prop of this library) which removes the readonly attribute which actually prevents the form submission on empty required field and also displays the native browser popup. The side effect is a date can now be directly typed into the input field which then forces you to parse the user input. To make up for that you have to suppress all user input in the field.

See the similar flatpickr question where I posted the complete solution. I used the onReady event of flatpickr which seems to have no equivalent in vuejs-datepicker settings unfortunately.

Flatpickr can be used in Vue thanks to vue-flatpickr-component library if you are OK with migrating.

Related