TobyMosque / app-extension-qdatetimepicker

QDateTimePicker for Quasar

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

12 hour format on time that allows inline edit.

CChristiansen23 opened this issue · comments

Quasar's date and time pickers allow a mask to be able to format the display on a q-input (not in the picker).
mask="YYYY-MM-DD hh:mm A"

I was able to accomplish something similar with a computed property using display-value, however, I lose the ability to type directly into the input field. Would be awesome to have the same functionality that "mask" gives on the original date/time pickers from quasar v1.

Currently, i can't define a custom mask definition like:

T: {  pattern: '[apAP]', negate: '[^apAP]', transform: v => v.toLocaleUpperCase() }`

what do u think about a extra button, who will toggle between AM and PM?
Eg.: https://codepen.io/tobias-mesquita/pen/OeVbMd?editors=1010

I think a toggle for that would work. I am using datetime mode on my pickers to display the date and time in the same input. Having the time display in 12 hour format to the users with an am/pm toggle, while still being able to inline edit would work great.

Eg.: https://codepen.io/tobias-mesquita/pen/OeVbMd?editors=1010
(try to type [A], [P], [Arrow Up], [Arrow Down] or click in the AP/PM)

feature implement on ver 1.0.0-beta.1