Text Input
A text based input, can be used for a variety of text based use cases by changing the type to below options.
Available Text Input Attributes
| Attr | Value | Description |
|---|---|---|
autocomplete | on/off | Specifies whether an element should have autocomplete enabled |
autofocus | on/off | Specifies that an element should automatically get focus when the page loads |
formnovalidate | Boolean | Defines that form elements should not be validated when submitted |
readonly | Boolean | Specifies that an input field is read-only |
minlength | number | Specifies the minimum number of characters required in an element |
maxlength | number | Specifies the maximum number of characters allowed in an element |
required | Boolean | Specifies that an input field must be filled out before submitting the form |
pattern | regexp | Specifies a regular expression that an element's value is checked against |
Email Input
A email based text input, used to accept email addresses only.
Telephone Input
A telephone based text input, used to accept telephone numbers only.
Note:
Any character can be entered into this input type, and might need extra validation to work correctly.
You can also use the inputmode attribute where necessary:
Any character can be entered into this input type, and might need extra validation to work correctly.
You can also use the inputmode attribute where necessary:
inputmode="numeric" Password
A password based text input, used to accept characters however hidden to the user.
Similar Components:
URL Input
An input for accepting only web addresses.
Labels
A text input should always be paired with its label counterpart.
Validation Feedback
Validation classes for user feedback.
Work in progress