New to Telerik UI for ASP.NET Core? Download free 30-day trial

Label Overview

The Label enables you to associate a label HTML element with the TextArea.

Basic Usage

To associate a TextArea TagHelper with a Label, set the label property by providing a string or a function. The string and the function parameters are setting the inner HTML of the label.

Initializing the Label for the TextArea

The Label tag exposes a content attribute that sets the inner HTML of the label.

The following example demonstrates how to create a Label content from a string.

<kendo-textarea name="FirstName">
    <label floating="true" content="Description"/>
</kendo-textarea>

The following example demonstrates how to create a Label content from a function.

<kendo-textarea name="FirstName">
    <label content-handler="labelContentHandler" />
</kendo-textarea>
<script>
    function labelContentHandler() {
        return "First Name"
    }
</script>

Floating Label

The Floating Label enables you to provide a floating label functionality to the TextArea.

The following example demonstrates how to set a Floating Label for a TextArea TagHelper.

<kendo-textarea name="FirstName">
    <label content="First Name" floating="true" />
</kendo-textarea>

If set to true, the component will be wrapped in a container that will allow the floating label functionality.

Important: The value client-side method does not trigger the focusout event of the input. This could affect the floating label functionality. You can overcome this behavior by manually invoking the refresh method of the Floating Label: $("#textarea").data("kendoTextArea").floatingLabel.refresh();

See Also

In this article
Not finding the help you need? Improve this article