←back to thread

Pikaday: A friendly guide to front-end date pickers

(pikaday.dbushell.com)
287 points mnemonet | 10 comments | 11 Nov 25 14:58 UTC | HN request time: 0.038s | source | bottom
Show context
abanana ◴[11 Nov 25 21:59 UTC] No.45893468[source]▶
A few years ago I wrote a mobile app for use by patients of local doctors' surgeries. This meant a higher-than-average proportion of older, less tech-savvy users.

There was a flood of complaints about the OS-native date pickers, along the lines of: "There's no way to set the year! To get to my birth year, I had to tap the previous-month arrow 720 times!" (It seems people actually did this.)

This is what happens in the real world when Flat Design takes over UI controls. On both iOS and Android (a few years back, I don't know whether they've been improved now), the year just looked like a heading. Nothing whatsoever suggested it was a tappable UI element.

Now that mobile OS UI decisions are seemingly led entirely by aesthetics, instead of being run by a seasoned UX researcher like Don Norman, using an OS-native datepicker leaves the usability of our apps entirely at the mercy of what they choose to mess up next.

I used Pikaday on a few websites years ago. We're told these tools are now obsolete - I wish that were true.

(Changing the app to use textbox-dropdown-textbox for date-monthname-year - this is in the UK - stopped any further such complaints.)

replies(5): >>45893504 #>>45893624 #>>45899065 #>>45902020 #>>45903234 #
padjo ◴[11 Nov 25 22:15 UTC] No.45893624[source]▶
Why were you using a calendar picker for a date of birth?
replies(1): >>45893751 #
abanana ◴[11 Nov 25 22:27 UTC] No.45893751[source]▶
Could you explain what you mean? We're talking about the OS-native datepicker, which pops up when a user clicks on an HTML <input type="date">.
replies(2): >>45894468 #>>45897754 #
1. folmar ◴[11 Nov 25 23:45 UTC] No.45894468[source]▶
This is the place where the date picker does not help the user at all. It's easier to type the, presumably memorized, date, than to look it up in the calendar no matter how nice and handy the calendar is. Sure it does solve validation problem. Or maybe not correctly, don't ask about locales and date adjustments.
replies(2): >>45894690 #>>45894825 #
2. nozzlegear ◴[12 Nov 25 00:10 UTC] No.45894690[source]▶
Doesn't the browser automatically a handle locales when using the HTML5 input=date?
replies(1): >>45895355 #
3. dotancohen ◴[12 Nov 25 00:26 UTC] No.45894825[source]▶
Date picker widgets do not solve any validation problem, because validation happens on the server side and client input is not to be trusted.
replies(1): >>45896811 #
4. folmar ◴[12 Nov 25 01:28 UTC] No.45895355[source]▶
Even if, that does not help. When asked for a birthday I need validation of the date in country when I was born, not the country I'm in, not the locale I'm using for display and not the locale server/requesting company is in.
replies(1): >>45903259 #
5. tlamponi ◴[12 Nov 25 05:58 UTC] No.45896811[source]▶
Obviously, but additionally, providing validation on the frontend can help UX a lot. Doing that can provide much quicker feedback compared to an error thrown at the user only after submitting a form, which can get especially annoying if the latter loses (some of) its values due to submission. And one solution for that problem can be using a native picker.
replies(1): >>45897760 #
6. padjo ◴[12 Nov 25 08:36 UTC] No.45897760{3}[source]▶
That is called input assistance, confusing it with validation is the source of millions of security problems.
replies(2): >>45898678 #>>45899634 #
7. __jonas ◴[12 Nov 25 10:58 UTC] No.45898678{4}[source]▶
That’s an interesting suggestion, but it is not, it’s called (client side) form validation

https://html.spec.whatwg.org/multipage/forms.html#client-sid...

I definitely see your reasoning for wishing it had a different name though.

replies(1): >>45900836 #
8. tlamponi ◴[12 Nov 25 13:03 UTC] No.45899634{4}[source]▶
No, it's not. And if that's what confuses one, it will not be the actual source of these problems.
9. johnisgood ◴[12 Nov 25 14:43 UTC] No.45900836{5}[source]▶
I do understand what "client-side" validation is, but I wish it had a different name, because people think they can just validate client-side and they do not bother doing it on the server... for some reason, I do not know. It should be obvious though, right? Yet it is not.
10. jrochkind1 ◴[12 Nov 25 17:50 UTC] No.45903259{3}[source]▶
I am thinking about locale of how a date/time is formatted for display/input. Including language-specific month names etc.