Inputs

Input overview

Inputs allow for users to enter and edit information, typically in a Form. They come in a variety of types that control the formatting of the information being entered.


Variations

  • Text - Text is the default type for Input. Any keyboard text may be entered including numbers and symbolsText input example
  • Password - The password type can accept any text from the keyboard, but will be hidden from view as to protect the secrecy of the password being enteredPassword input example
  • Numeric - The number type will only allow numerical data entered from the user. Any other characters that are typed will be ignoredNumeric input example
  • Email - The email type will accept all characters entered, but has built in validation for email addresses. If an invalid email is entered, an error will be thrown when the Form containing this Input is submitted
  • URL - The URL type will accept all characters entered, but has built in validation for URLs. If an invalid URL is entered, an error will be thrown when the Form containing this Input is submittedURL input example
  • Phone number - The tel type will accept numbers only and has built in validation for telephone numbers. If an invalid phone number is entered, an error will be thrown when the Form containing this Input is submittedPhone input example
  • Color - The color type will allow a user to select any color from a provided color palette. The selection is saved in hexadecimal notation with #000000 (black) being the default. Note: The color type does not support a placeholderColor input example

Last updated: Oct 2020