Form errors

This pattern is the style for showing form validation errors.

Rules for form errors

  • The error summary must be at the top of the page.
  • The error summary must help the user understand why the error occurred and what to do about it.
  • The error summary must include a heading to alert the user of the specific error.
  • The error summary must link to each of the problematic form answers.
  • Additional error text must appear above the input field for each invalid form answer.

Options available


Errors on input fields

Example
Your personal details
As shown on your birth certificate or passport Please enter your full name
Please enter a valid telephone number using only digits
Code

Your personal details
As shown on your birth certificate or passport Please enter your full name
Please enter a valid telephone number using only digits

Errors on radio buttons

Example
Check your personal details

Are your personal details correct and up-to-date?

Please select an option
Code

Check your personal details

Are your personal details correct and up-to-date?

Please select an option