html - how can I set a max value on my html5 date input so that it could be recognized by safari for iOS?

Question

The title is pretty clear I guess?

Here's my date input :

<input type="date" id="birthdate" name="birthdate" value="" max="1993-12-07" required/>

In chrome, I cannot enter a date superior to 1993-12-07 using the little arrows of the field (but if I write the date myself I can).

In safari for iOS, focusing that field just brings a nice datepicker. However, this datepicker is NOT limited to the "max" attribute. So how can I do that? Of course, I have a server-side form validation but I want to make it on client-side too. Any idea? Thanks!

Answer 1

Safari does not yet support it yet . Only Opera and chrome support it as of Nov 2011. Anyways here is the w3spec on it http://www.w3.org/TR/html-markup/input.date.html#input.date.attrs.max

You can use js validation on submit or on change. Use a js validation framework of your choice

Here is pure js example http://www.roseindia.net/answers/viewqa/Ajax/4734-start-date-and-end-date-validation-in-javascript.html. Use your max date instead of end date

For jquery solution look at this Validate that end date is greater than start date with jQuery