RobinHerbots / Inputmask

Input Mask plugin
https://robinherbots.github.io/Inputmask/
MIT License
6.39k stars 2.17k forks source link

No leading zero for single-digit hours KO #2061

Open dsbl411 opened 5 years ago

dsbl411 commented 5 years ago

Describe the bug

For the datetime alias, the single-digit hours with no leading zero don't work. It happens for both 12 hours (symbol h) and 24 hours date (symbol H).

2 digits date cannot be input.

The mask are also not correct: For 12 hours date, it displays "h:0M TM" for the inputFormat "h:MM TT" For 24 hours date, it displays "H:0M" for the inputFormat "H:MM"

To Reproduce

Steps to reproduce the behavior:

  1. Go to 'https://codepen.io/anon/pen/zedazL'
  2. See errors

The issue can be reproduced with version 4.0.6 and 5.0.0-beta.121 Expected behavior

Single-digit hours with no leading zero should work

Live example

https://codepen.io/anon/pen/zedazL

Desktop (please complete the following information):

Thanks for your awesome library BTW 💯

dsbl411 commented 5 years ago

Hi again,

Maybe this can help you narrow down the issue.

I tried to implement the time masks using regexes and I encountered a similar if not same issue.

Here's the regex I used to simulate no leading zero for single-digit hours (24-hour clock): (1?[0-9]|2[0-3]):[0-5][0-9]

And here's a link to see the issue: https://codepen.io/anon/pen/RvLGvq

Thanks

RobinHerbots commented 5 years ago

@dsbl411 ,

Ok I see.
Actually you want the hh:MM & HH:MM formats, but with the convenience when you type 1:14 it converts to 01:14. I will (try to) add that.

There is still an issue with the placeholders in the datetime alias, but that will be fixed later.

RobinHerbots commented 5 years ago
 Inputmask({
            alias: "datetime",
            inputFormat: "hh:MM",
            placeholder: '_',
        }).mask("test2");
RobinHerbots commented 5 years ago

@dsbl411 ,

I will also fix for

 Inputmask({
            alias: "datetime",
            inputFormat: "h:MM",
            placeholder: '_',
        }).mask("test2");