2

I have an input that invokes a datepicker (with pickadate.js) that requires the user to click on it to choose a date. This is what it looks, as an example:my input

From a UX perspective, how do you make it extremely obvious to the user that they should click this to select other dates?

Improve this question
3
  • 1
    I find this question strange, because in my experience, a user who wants to change the date will click there without the need for any hints. What behavior are you observing instead of clicking? Do you mean that the field allows type editing, only the button to the right opens a date picker, and you want the users to always use the date picker? If this is the case, the best solution is probably not to use any hints, but to remove the text editing and have the picker open when the user clicks anywhere in the field.
    – Rumi P.
    Commented Aug 25, 2014 at 9:19
  • 3
    In your example, much would be helped by removing the white space between the text and the button. Things that are close together are associated in the mind. With this much white space, people lose the connection.
    – Peter
    Commented Aug 25, 2014 at 10:18
  • 1
    Yeah, I'm not really a fan of full width anything, only because, as @Peter has stated, objects closer together (Gestalt) are then considered to be the same, or associated to one another.
    – UXerUIer
    Commented Aug 25, 2014 at 12:12

3 Answers 3

Reset to default
2

You're asking how to make it extremely obvious, so you could write

Click to select other dates

into the textfield. E.g.

24 August, 2014 (click to select other dates)

Improve this answer
0

By virtue of having a control which resembles a text field and a button, you have already provided the user with something he or she knows can be clicked. I would also suggest adding placeholder text ('Enter a date...' perhaps?) rather than a default date to prevent the user from assuming that the default date is unchangeable.

Improve this answer
0

If you want it to be extremely obvious, that the user should click on the button to select a date, I suggest you add a label to the button or replace the icon with a label. The label could say something like "Change Date", or maybe just "Change" or "Select," given that it follows a text control that already contains a date.

Improve this answer

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.