New to Kendo UI for Angular? Start a free 30-day trial

Environment

ProductProgress® Kendo UI FloatingLabel

Description

The FloatingLabel text overlap with the component value.

Cause

The floating animation will not work when the value of the input control is set programmatically. Instead the floating label and the component value will overlap.

In general, the FloatingLabel relies on handling valueChange and focus events. But neither is triggered when the value is changed programmatically.

Solution

To workaround this issue, you can utilize any of the following approaches:

  • Use Angular forms by utilizing the ngModel or the formControl binding.
  • Manually focus the component after the value is updated.

The following example demonstrate how to update and focus the MultiSelect component programmatically.

Example
View Source
Change Theme:

In this article

Not finding the help you need?