• Getting Started
  • Components
    • Barcodes
    • Buttons
    • Chartsupdated
    • Conversational UIupdated
    • Data Query
    • Date Inputsupdated
    • Date Math
    • Dialogs
    • Drawing
    • Dropdownsupdated
    • Editor
    • Excel Export
    • File Saver
    • Filter
    • Gantt
    • Gauges
    • Gridupdated
    • Icons
    • Indicators
    • Inputsupdated
    • Labels
    • Layout
    • ListBox
    • ListView
    • Map
    • Menus
    • Navigation
    • Notification
    • Pager
    • PDF Export
    • PDFViewer
    • PivotGridupdated
    • Popup
    • ProgressBars
    • Ripple
    • Schedulerupdated
    • ScrollView
    • Sortable
    • Spreadsheetupdated
    • ToolBar
    • Tooltips
    • TreeList
    • TreeView
    • Typography
    • Uploads
    • Utilities
  • Styling & Themes
  • Common Features
  • Project Setup
  • Knowledge Base
  • Sample Applications
  • FAQ
  • Troubleshooting
  • Updates
  • Changelogs
New to Kendo UI for Angular? Start a free 30-day trial

Hints and Errors

The FormField enables you to display hint and error messages.

To render hints and errors, add the HintComponent or ErrorComponent instances inside the FormField component.

Default Setup

By default, the errors are hidden and will be displayed when the form control is invalid after user interaction. If provided, the hints will be initially visible and will hide if an error occurs.

Example
View Source
Change Theme:

Visibility

You can control the behavior of hint and error messages by setting the showHints and showErrors properties.

The available showHints values are:

  • (Default) initial—The hint messages are displayed when the state of the form-bound component is valid or untouched, and pristine.
  • always—The hint messages are always displayed, leaving the control of their content visibility to the developer.

The available showErrors values are:

  • (Default) initial—The error messages are displayed when the state of the form-bound component is invalid and touched, or dirty.
  • always—The error messages are always displayed, leaving the control of their content visibility to the developer.
Example
View Source
Change Theme:

Alignment

Both the HintComponent and ErrorComponent allow you to specify the text alignment by setting the align property.

Example
View Source
Change Theme:

In this article

Not finding the help you need?