Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

html 5 forms input type time with min and max

Tags:

html

forms

I have been able to use input type date with min and max attributes in a form I am designing taking advantage as much as possible of HTML 5. Nevertheless I am not able to do the same if input type is time.

Relevant code:

<input style='width:120px' required name='dia' id='dia' type='date' min="1991-01-01" max="2014-05-12">
<input style='width:80px' required name='hora' id='hora' type="time" min="08:00:00" max="20:00:00"/>

(min and max in the latter are ignored)

Other relevant information:

  • As far as I can tell the HTML 5 specification allows min and max in both cases.

  • I am using minimizr and webshims for this form which makes input date fields available in FF, etc.

  • No different behavior detected between recent major browsers.

  • A site like W3C schools mentions min and max for date but not for time which may indicate a general lack of enthusiasm for min and max as attributes for time.

Am I missing something obvious?

like image 329
jmatos Avatar asked May 12 '13 10:05

jmatos


People also ask

How do you set minimum and maximum time in input type time?

The min attribute specifies the minimum value (time) for a time field. Tip: Use the min attribute together with the max attribute to create a range of legal values. Tip: To set or return the value of the max attribute, use the max property.

How do I add AM PM to input type time?

If you want the time with AM & PM, check the first two values, and utilize something like the following: if(FirstTwoNums > 12){ FirstTwoNums -= 12; PM = true;}/*else, PM is false */ .


1 Answers

It works. It get triggered on oubmit saying type a time bigger or equal to 08:00. (Tested in chrome)
Some other browser ignore attribute min, max, required so pay attention to do it with JS too.

like image 144
Akxe Avatar answered Oct 01 '22 11:10

Akxe