3

I am building a form for Mobile Web that requires users to enter in their DOB.

I'm interested in how it is presented across different mobile OSes and browsers as I understand support is patchy.

Is current browser support good enough to make using <input type="date"> a good choice?

On iOS 5, it appears to bring up the native date selector (see screenshot here http://blog.teamtreehouse.com/using-html5-input-types-to-enhance-the-mobile-browsing-experience). It's a compound date picker with scrollers for Day (DD), Month Name (MMM) and Year (YYYY).

enter image description here

That looks pretty much ideal - the spinner-style for the year input is a quicker way to get back to your year of birth than with a traditional dropdown list on a desktop browser.

On Android 4.1.1, it presents a plain text box. Tapping it brings up a nice compound date picker popup with spinners for Day (DD), Month (MM) and Year (YY). With proper form labeling that is fine.

What about on other devices and mobile browsers?

Here's a quick test page: http://jsfiddle.net/Px6tA/embedded/result/

Let me know what you find!

Improve this question
5
  • 1
    Here's a more comprehensive test page: quirksmode.org/html5/tests/inputs_dates.html
    – Dan
    Commented Jun 18, 2013 at 18:58
  • There's an answer here but it is out of date as it says there is no support in Android, when there actually is, as described above: quirksmode.org/html5/inputs_mobile.html
    – Dan
    Commented Jun 18, 2013 at 18:59
  • you should make an answer with a summary of the information from that link; that's exactly what the OP needs.
    – Vince Bowdren
    Commented Jun 19, 2013 at 14:15
  • The page is out of date - for example, it's missing the fact that Android 4.1.1 does support datepicker.
    – Dan
    Commented Jun 19, 2013 at 16:54
  • 1
    Here's another useful resource - wufoo.com/html5/types/4-date.html - but again it is out of date (only goes up to Android 2.3) - I'm coming to the conclusion that "HTML5 input types are not yet widely or consistently supported, better to stick with a standard text field"!
    – Dan
    Commented Jun 19, 2013 at 16:57

1 Answer 1

Reset to default
3

I'll spin your question around a bit: how is a datepicker UI useful for filling in one's birth date?

Date Picker UI's are usually useful when it's important to understand the context of the day within a calendar. Ie, when is next Friday? Or what is exactly one month ago?

But with a birthdate, that's a memorized date and where it falls on the calendar is somewhat irrelevant.

Furthermore, the older one gets, the more cumbersome the date picker becomes as they have to navigate through that many more years and months to enter a date.

Based on all of that, I'd strongly suggest making a birthdate field a text field.

Improve this answer
1
  • 1
    I totally agree that a calendar-based date picker is not right for a date of birth. I imagine that is why neither iPhone nor Android use that input pattern for the date input type. Instead they both use a compound control with three spinner-style dropdowns (see the screenshot in the blog I referenced). That does allow you to spin back to your year of birth quite quickly (certainly more quickly than a traditional dropdown on a desktop browser). But maybe a text field is still better for consistent support across mobile browsers!
    – Dan
    Commented Jun 19, 2013 at 10:32

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.