Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Table of Contents

...

  • On hover over the text field, the mouse cursor will change to a text cursor.

  • On click:

    • Where no text has been added to the field:

      • A text cursor will appear at the beginning of the text field.

      • The hint text will disappear.

    • Where text already exists in the field:

      • A text cursor will appear in the position where the user clicks.

      • Double-clicking a word inside the text field will select that word.

      • Triple-clicking the text field will select all of the text.

  • When the text field becomes inactive (user clicks away) the hint text will reappear, if no other text has been added.

  • If a character limit has been set, reaching the limit will prevent the user from entering any more characters. 

  • For secured fields (such as password), the characters are hidden, even when typing. They will be displayed as dots instead:

Validations and errors

Please refer to the Field validation page for more information.

A text field with a warning will have an orange border and a warning icon, as shown below: 

...

  • Always provide a clear and meaningful preceding label for any input field.

  • Where appropriate, help users by providing a hint text describing the expected input text.

  • Help users to identify and fix errors as they occur.

  • When the user is filling in a secured text field, allow them to temporarily view the text.

...