Label

  • 2 min to read

Label is a label extension that allows you to display text on a web page.

Implementation Details

Label is a LabelExtension class instance. The ExtensionsFactory.Label helper method allows you to add a Label extension to a view. This method's parameter provides access to the Label's settings (LabelSettings).

The ASPxClientLabel object is a Label's client counterpart.

Note

Use the Overview - LabelFor extension to specify a label element's for attribute.

Declaration

The following code snippets illustrate how to add a Label to a view:

View code (ASPX):

<% 
    Html.DevExpress().Label(
        settings => {
            settings.Name = "label1";
            settings.Text = "Some text";
            settings.Properties.EnableClientSideAPI = true;
        }
    )
    .Render();
%> 


<% 
    Html.DevExpress().Button(
        settings => {
            settings.Name = "myButton1";
            settings.ClientSideEvents.Click = "function (s, e) {label1.SetText(label1.GetText() + ' New text');}";
        }
    )
    .Render();
%> 

View code (Razor):

@Html.DevExpress().Label(
    settings => {
        settings.Name = "label1";
        settings.Text = "Some text";
        settings.Properties.EnableClientSideAPI = true;
    }).GetHtml()


@Html.DevExpress().Button(
    settings => {
        settings.Name = "myButton1";
        settings.ClientSideEvents.Click = "function (s, e) {label1.SetText(label1.GetText() + ' New text');}";
    }).GetHtml()
Note

The Partial View should contain only the extension's code.

The image below shows the result.

label-declaration.png

Main Features

  • Ability to Associate a Label to an Extension

    You can specify an extension with which the Label extension is associated. In this case, the label renders as an HTML label element, with the for attribute set to the Name property of the associated extension. Label attributes can be used to extend the functionality of the associated extension. You can define an associated extension with the LabelSettings.AssociatedControlName property.

    @Html.DevExpress().Label(
    settings => {
        settings.ControlStyle.CssClass = "label";
        settings.Text = "Product Name:";
        settings.AssociatedControlName = "ProductName";
    }).GetHtml()
    
    @Html.DevExpress().TextBox(
        settings => {
            settings.Name = "ProductName";
            settings.ControlStyle.CssClass = "editor";
        }
    ).Bind(Model.ProductName).GetHtml()
    
  • Appearance Customization

    The Label appearance can be customized in different ways: by applying DevExpress built-in themes, by specifying CSS classes or by using different label appearance properties (for example, using the LabelSettings.Properties.Style property).

    See this topic to learn more about appearance customization using predefined built-in visual themes: Applying Themes.

  • Full-Featured Client-Side API

    The Label provides you with a comprehensive client-side API. This API is implemented using JavaScript and is exposed via the ASPxClientLabel object. The ASPxClientLabel object serves as a client-side equivalent of the Label extension.