Skip to main content
U.S. flag

An official website of the United States government

Dot gov

The .gov means it’s official.
Federal government websites often end in .gov or .mil. Before sharing sensitive information, make sure you’re on a federal government site.

Https

The site is secure.
The https:// ensures that you are connecting to the official website and that any information you provide is encrypted and transmitted securely.

Patterns

Ask users for…

Dates

Use: Deployed
Use this pattern to collect dates from a person.

Usage

When to use this pattern

Follow this pattern whenever you need a person to provide a date on a form.

Dates you may need people to provide include:

  • Dates a person knows, like a date of birth or marriage anniversary.
  • Dates a person can approximate, like February 2021.
  • Date ranges, like service history dates.

Dates a person knows

Use the Memorable date component for dates a person is likely to have memorized such as a date of birth or marriage anniversary.

Date of birth

Shows the form fields used to obtain date of birth.
Example of asking for a date of birth.

View an example

Date and place of birth

Follow this pattern whenever you need to ask for a user’s date and place of birth.

Shows the form fields used to obtain date and place of birth.
Example of asking for a date and place of birth. NOTE: This screenshot shows an outdated date component. Use Memorable Date for collecting date of birth.

Dates a user can approximate

Use the month/year date component variation for dates that a user may struggle to remember. For example: When did you receive your high school diploma or equivalency certificate?

Shows the date input for collecting approximate dates.
Example of using the month and year date component for collecting a date a user can approximate.

Date ranges

Refer to the Service history pattern for an example of collecting service date ranges.

How to design and build

How this pattern works

  • Write clear form labels for date ranges Do not use “From” and “To” to when labeling form labels for date ranges. Make it clear what dates you’re asking for. Example: “Obligation start date” and “Obligation end date”
  • Spell out full month names in the selected state The month select box should have the full month’s name. Example: January
  • Validate date inputs. You should validate date inputs so you can let users know if they have entered one incorrectly. A general validation message for an incorrect date: Please enter a valid date
  • Use the date input field for date of birth. Writing out the label for each birth date string and separating them into three fields instead of one eliminates potential format confusion.
  • Use one text input for Place of birth. This format is easier to fill out for both Veterans born outside the United States and for Veterans who were born United States citizens.

Content considerations

Error message templates for dates

If nothing is entered Say ‘Please enter a date’

If the date entered can’t be correct Say ‘Please provide a valid date’

If the date entered is in a month year format and can’t be correct Say ‘Please enter a valid month and year’

If the year needed to be within a specific range Say ‘Please enter a year between [minimum year] and [maximum year]’

For a date range, if the date must be after another date Say ‘To date must be after From date’

If the date is in the past when it needs to be today or in the future Say ‘Please provide a valid current or future date’

If the date is in the future when it needs to be past date or current date Say ‘Please enter a valid current or past date’

Edit this page in GitHub (Permissions required)
Last updated: Sep 19, 2023