1

I'm designing a date picker that allows users to select a date range from the past to retrieve past records.

In travel or booking date selectors, when selecting a future date range, the first date to select is the 'from'.

My question is whether the 1st date to select should be the 'from' date or the 'to' date when using a date picker for past dates. Or does that matter at all?

enter image description here enter image description here

2
  • Please don’t forget that each of the two date inputs needs a unique label, even if hidden visually. Google Flights uses “Departure” and “Arrival”. The answers suggest not forcing the user to pick dates in any predetermined order, which is great, but you still will need to find speaking labels. It could be “date 1” and “date 2”, of course. (:
    – Andy
    Jul 12, 2022 at 12:45
  • Is the user’s task in your case to search records based on specific periods of time? Or might periods of time be an interesting pattern as well? Like Last week, month, 6 months, year, previous year f.e.?
    – Andy
    Jul 12, 2022 at 12:46

3 Answers 3

3

Why not make it both?

The first date you click (A) will light up. If you then move your mouse to another date (B), date B and all the days in between will light up.

If date B is earlier than date A, B will be the 'from' and A will be 'to'. If B is a later date than A, A will be the 'from' and B will be 'to'.

If the days in between A and B light up, the user will already see the timespan they are inputting before they click date B.

3
  • 1
    This is actually a good suggestion. btw I've updated the question with the double combo box that opens the calendar view.
    – Blue Ocean
    Jul 12, 2022 at 8:25
  • 1
    Was about to answer that. It's just a range. It really doesn't matter if you select the end or start date first. It's a range between points, regardless of which you put first.
    – Kriem
    Jul 12, 2022 at 11:17
  • @BlueOcean for the double input, you could make the first date fill both boxes, and depending on the 2nd date you clickm change one of the boxes to get the correct span. The tricky part is when a user then clicks a third date. IMO the process can be restarted with that new date as date A.
    – Tvde1
    Jul 12, 2022 at 13:58
2

I think the most common pattern is for date pickers to have the first click be the "from" date. This will probably be the most intuitive pattern for users who have used datepickers on other sites, even though the dates are in the past.

1
  • 1
    Yes! Always go for a recognised pattern if you can (and as long as it makes sense!) Jul 12, 2022 at 10:45
0

As mentioned before, you can do it both ways. For example, you can see that Google Flights will let you click on any two dates on their calendar to define the date range without specifically having to clicking 'From' or 'To'

Google Flights

enter image description here

Your Answer

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

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