Hi people,
I have another question. There is such topic already in this forum, but I didn’t find the satisfying answer. There is a date picker widget, but it is only a pattern. Is there a way to realize Date picker, so it checks this day and calculate the calendar for the next months or should I “programm” it myself?
Thank you!
You can try using Text Field Input Types, Text Field HTML Input Types (Textfield Type, Date Picker, Number/Password Field, File Selector).
If that isn’t good enough for your needs here are more posts to explore further:
http://www.axure.com/forum/axure-rp-pro-archive/1334-functional-calendar-date-picker.html
iPhone Date picker?
Calendar Date Picker
(Answered) Date Picker & Calendar Widgets available for download
Thank you for this answer. I was a bit confused, because I’ve tried this earlier, and that didn’t work. Now I checked this, so it works only in Chrome browser. In Firefox or in IE this text field with type “Date” looks like simple Text field and I can’t choose the date. What could be the reason?
As explained in this post, http://www.axure.com/forum/tips-tricks-examples/9865-text-field-html-input-types-textfield-type-date-picker-number-password-field-file-selector.html, not all browsers support all HTML5 elements. A link is provided to check, HTML5test - How well does your browser support HTML5?.
At the risk of forking this thread, I think pre-built complex UI components are a bad idea in tools like Axure, and I wish they weren’t there.
Personally, I would always design a date picker from scratch to suit the context I am designing for rather than use a pre-fabricated one.
But I realise I’m in the minority on that one.
Hello,
someone created the following file that I downloaded a couple of weeks ago: DatePicker.rplib (280 KB)
It is a full functional date picker (shows current date and month). It is done very well - really great work. Unfortunately I can not find/access the original thread, but I think it is that one: http://www.axure.com/forum/general-discussion/1334-functional-calendar-date-picker.html
Thanks to the unknown creator of that amazing date picker.
EDIT: The creator has a name: http://www.axure.com/forum/members/jeff-harrison.html Thank you very much Jeff!
Regards,
Ben
“It is done very well - really great work”
It sucks 
Ha ha, only serious! See my comment above. I’ll shut up now - apologies.
That’s mine. You’re welcome! I built that in (I think) v5.5. Pretty cutting-edge at the time but not very configurable and way more complicated to construct than it would be today.
J
We’re forked.
I agree, to a point. I build a lot of prototypes for user testing, and I’m usually early enough in the process that the usability of a date picker is not a question I am trying to answer. In these cases even having a date picker to begin with is optional, but it’s a nicety, and if I have one that’s ready to go I will drop it in. On the other hand, I almost always want to see people interact with my navigation, and I never use the pre-built menu widgets that come in Axure because they’re too constraining.
A similar theme is emerging in my workshops these days as I discuss push/pull, built-in hint text, lightboxes, OnSwipe, and so on: There are a lot of canned interactions that can make your life easier if you don’t care about the details, but with this convenience comes lack of flexibility.
Jeff
I think there’s a lot to be said for leaving details out if you’ve not thought about them enough to say something constructive about why they work as they do. I think it’s actively dangerous to plonk a canned interaction/designed component on the canvass and then not think about it again until it becomes accepted by force of simple inertia. In other words “make your life easier if you don’t care about the details” turns into plain bad design further down the line.
It’s hard to say how corrosive this phenomenon is when looking at finished stuff in the wild, but I think I can see it quite often. Things like poor usability of tree menus, unnecessary pagination … and date pickers that don’t apply very well to the time frames users are expected to navigate. I witnessed the following twice in user research on a live site a few of years ago, to illustrate the latter example:
When choosing a date on which to book a flight, they selected the date picker, which only showed a single calendar. The desired flight date was early in the next month, so they needed to progress to that but hit the “year” increment instead. After a partial recovery to select the correct month, they ended up booking a (very cheap!) flight 12 months after they actually wanted to travel.
The date picker looked very much like it came from a standard UI library.
All this is also why I think the notion of obeying “design patterns” is probably better re-cast as avoiding anti-patterns instead.
… and we’re forked for sure.
Jeff’s DatePicker suited my needs perfect. Granted, not a complex one but my designs only need a working simple date picker for “When was this form filled” type of examples. Type of which comes with Balsamiq’s standard library that I was very happy with.
Thanks Jeff!
I’m not able to get date input from the native date picker and store it as a global variable. When I step through the code using Firebug, I get the following error: “Uncaught InvalidStateError: Failed to execute ‘setSelectionRange’ on ‘HTMLInputElement’: The input element’s type (‘date’) does not support selection.”
This suited my needs perfectly too. I didn’t need it to do any further actions/provide calculations, just to simply display the date picker and pop the value into the ‘cell’ when picked for part of my demo. It was exactly what I needed!
Thanks Jeff!
Seriously wish I could thank you more than once. I use this on just about a daily basis and would be lost without it.
So thanks…again.
Does this date picker still work - i couldn’t get it to function…I am using Axure 8. Thanks
Hi, rsmith731. I just downloaded it and it works for me, but it’s so old I wouldn’t have been surprised if it hadn’t. I whipped up this one this evening in Axure 8, which was so much simpler. I haven’t tested it extensively but it seems to work okay and it’s more configurable than the old one. Hope it works for you.
Jeff
date picker Axure 8.rp (73.8 KB)
Wow, Jeff - that’s a clever use of filtering! (I liked the earlier one that rearranged the columns, too. Cool.)
Here’s one I created a while back. The code isn’t nearly as tidy, but since it doesn’t access the dataset in its repeater (it uses an offset of item.index instead) it’s pretty fast. It also highlights the current day / selected day if either occurs in the current month. The UX is weird for choosing a new year (I challenge anyone to find it), but it’s based on how Android’s date picker does it.
Ah, I gotcha. That’s pretty nice. The real story for me is that it’s possible to put something like this together in an hour or so today. I don’t even remember how long it took me to do the old one but it was much more than that. (I don’t think that whatever version of Axure I was using allowed copying and pasting actions across cases, and if you realized that a widget needed to be inside a panel there was no way to get it there without breaking all the interactions that pointed at it.)
I did find the year selection but never would have if you hadn’t assured me it existed. That is unusual. I’m going to have to start doing that on other Android widgets to see what happens.
J
Thanks for this Jeff, it’s very handy. Are you able to tell me if I can easily change the displayed date from mm/dd/yyyy to dd/mm/yyyy?