vuetify-datetime-picker icon indicating copy to clipboard operation
vuetify-datetime-picker copied to clipboard

Allow manual input on text field

Open Vontus opened this issue 5 years ago • 2 comments

Add a prop to allow users to manually input the desired date and time with their keyboard.

  • When the prop is set to true:
    • Set readonly prop on text field to false.
    • Only open the dialog when clicking the calendar icon, not the text field.
    • On text field @blur event, validate input (input should have the format dateFormat + " " + timeFormat):
      • If no input, don't do anything.
      • If input isn't correct, display format error using vuetify's error-messages.
      • If input is correct, update datetime picker value and emit @input event.
    • On text field @focus event:
      • Clear vuetify error-messages prop.
    • When users select a new value from the dialog:
      • Update the text field value.

That may look too specific, but I'm open to changes. Please let me know what you think, I'm willing to open a PR myself if this is approved.

Vontus avatar Oct 31 '19 12:10 Vontus

Also looking for this behavior. @Vontus did you have a fork you're working off of?

gabaum10 avatar Dec 12 '19 20:12 gabaum10

@gabaum10 I haven't started yet. We changed priorities in our project and this isn't so important anymore, but we'll probably need manual date input in the near future anyway so I'm still open to do it.

Vontus avatar Dec 16 '19 21:12 Vontus