DxFormLayoutItem.Caption Property

Specifies an item’s caption.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v20.2.dll

NuGet Package: DevExpress.Blazor

Declaration

[Parameter]
public string Caption { get; set; }

Property Value

Type	Description
String	The item’s caption.

Remarks

Use the CaptionPosition property to to specify where to display item captions: above an item (Vertical) or at its left (Horizontal).

<DxFormLayout CaptionPosition="CaptionPosition.Vertical">
    <DxFormLayoutItem Caption="Location:" >
        ...
    </DxFormLayoutItem>
    <DxFormLayoutItem Caption="Check in:" >
        ...
    </DxFormLayoutItem>
</DxFormLayout>

Run Demo: Form Layout - Caption Position

To associate a component in a layout item template with the layout item’s caption, use the CaptionFor property.

<DxFormLayout>
    <DxFormLayoutItem Caption="Contact Name:" CaptionFor="name_text_box">
        <Template>
            <input value="@Name" id="name_text_box">
        </Template>
    </DxFormLayoutItem>

    <DxFormLayoutItem Caption="Email:" CaptionFor="email_text_box">
        <Template>
            <input value="@Email" id="email_text_box">
        </Template>
    </DxFormLayoutItem>
</DxFormLayout>

If you do not specify the CaptionFor property value but specify the Caption, the Form Layout generates a random identifier and sets it to the caption label’s for attribute and the associated component’s ID property.