6

User's PC is using the 12 hour clock (11:59 PM). User wants to enter time using the 24 hour clock (23:59). Browsers vary but Firefox (as an example) won't even allow you to type 23 for the hours, whereas some Win32 components from yesteryear let you type "23:__ --" but change it to "11:__ PM" as you move to the minutes field - still not ideal but better.

Do we still have to use some fancy 3rd party component to handles all the variations to give one unified UX across browsers? Are there plans to specify 24 hour formats in HTML5.1 (or whatever)?

I am aware this has been asked several times before but all answers that I've seen date from over a year ago and things have changed a lot since then.

GeoffM
  • 1,603
  • 5
  • 22
  • 34

1 Answers1

-1

At the moment, HTML5 time format is 24-hour format.

If you are looking for 3rd party libraries with a little configuration to convert back and forth between 12 and 24 hour format or accept input in either/both, there are many out there. I use this component in production, currently. You may wish to create your own component or use different components/libraries.

Also, simple mathematics can be used to convert 12 to 24 hour time and vice versa, and you can find that easily by Googling - that is not going to change dependent on the browser.

Demos here:

Download as ZIP here:

I use this in conjunction with moment.js:

TinkerTenorSoftwareGuy
  • 798
  • 7
  • 15
  • I would rather not but expect that I will have to. Thanks for the links. – GeoffM Jan 15 '18 at 19:47
  • 2
    Add'l comment after your edits. Firefox currently forces the user to select AM or PM. The user is entering dozens of time fields at a time and seeing "23:59" on the source document and having to mentally convert and then type "1159P" in the browser is a dramatic slowdown on entry speed - and they're not happy! I'm not sure how maths is going to help. – GeoffM Jan 15 '18 at 19:55
  • Your code needs to bridge the gap. Let the user enter what they see, and you can convert it in your code to what the system needs. Basic system requirements gathering. – TinkerTenorSoftwareGuy Jan 15 '18 at 23:38
  • 2
    Kind of stating the obvious! The question is basically about how to bridge that gap. Hopefully the gap will be addressed in the future with direct support. It's clear my situation is actually quite common so I hope so. – GeoffM Jan 16 '18 at 03:08
  • The input that a time input accepts is based on the user's locale setting, so you could ask the user to set their system locale to something that uses 24 hour notation, e.g. the UK (assuming they are English speaking). – JanKanis Aug 13 '20 at 09:56