bvakiti
bvakiti

Reputation: 3601

Input type=time is not working with min and max attributes

This question might be asked many times. But there is no clear explanation whether it is possible or not.

I have a input with type="time". I have applied min and max attributes to it. But still the picker shows all the time values and it is also possible to select any time value which not in the range.

<input type="time" id="gfg" name="Geek_time" placeholder="Enter time" min="16:00" max="22:00">

I'm checking this on android phone. This also does not work in web chrome browser. Whereas it works fine with input type="date"

Is this behaviour expected with time input?
Only JS based validation works here and not in-built min/max?

Upvotes: 3

Views: 17772

Answers (1)

Amit
Amit

Reputation: 2090

Below is a very simple html code. Once the html is rendered, you can enter any value you like but the form will not go through. Your browser has to be compatible. Check browser compatibility.

<html>
<head>
</head>
<body>
<form>
<input type="time" id="gfg" name="Geek_time" placeholder="Enter time" min="16:00" max="22:00">
<input type="submit">
</form>
</body>
</html>

I tried entering values outside the range (less than 16:00 or more than 22:00) and then submit the form. It gave errors.

Form validation fails for time less than 16:00 hrs Form validation fails for time more than 22:00 hrs

Upvotes: 2

Related Questions