The date picker lets users pick a date from a calendar or enter a date. The control also allows users to navigate directly from one month or year to another. When typing a date, the system validates the entry and provides the user with feedback.

With the date picker, the user can see a day view, month view, or year view, and can navigate between months and years.

Do

• Use this control if the user needs to enter a single date or a date range.
• By default display a label, unless the date picker is next to another control that already has a label.
• If you don’t provide a default date, show a placeholder text with a date to indicate the correct format and take localized versions into account.
• If the control is used in a table cell or a narrow form, then use the short date format. For example, in US English: 1/16/22.
• If there are no space limitations, then use the medium format. For example, in US English: January 16, 2022.
• If you need to display the weekday, use the full format. For example, in US English: Sunday, January 16, 2022.
• If you need to show a warning or error message related to this field, use the relevant state in the API properties.

Don’t

• Don’t use the date picker if you want users to also select a specific time on a given day, such as 8AM. In this case use the time picker control.
• Don’t use the date picker if you want users to select a range of dates. In this case use the date range selection control.