Skip to main content

FormLayoutGroupBase.Items Property

Contains nested elements in the Form Layout group and tab.

Namespace: DevExpress.Blazor.Base

Assembly: DevExpress.Blazor.v24.1.dll

NuGet Package: DevExpress.Blazor


public RenderFragment Items { get; set; }

Property Value

Type Description

A render fragment that defines a set of Form Layout items.


Use the <Items> tag to define nested elements of a group or tab. The tag should contain only DxFormLayoutItem and DxFormLayoutGroup components.

The Items collection separates templated and nested content if you apply the following templates:

Group Tab
DxFormLayoutGroup.CaptionTemplate DxFormLayoutTabPage.CaptionTemplate
DxFormLayoutGroup.HeaderContentTemplate -
DxFormLayoutGroup.HeaderTemplate DxFormLayoutTabPage.HeaderTemplate

In other cases, you can omit this tag.

The following snippet applies the HeaderContentTemplate to a group:

    <DxFormLayout SizeMode="Params.SizeMode"
        <DxFormLayoutGroup ColSpanMd="6">
                    Work Information
                <div class="demo-unemployed-checkbox-container">
                    <DxCheckBox CssClass="demo-unemployed-checkbox" CheckedChanged="@((bool t) => UnemployedChanged(t))" LabelPosition="LabelPosition.Left" Checked="@Unemployed">Unemployed</DxCheckBox>
                <DxFormLayoutItem Caption="Position:" ColSpanMd="12">
                    <DxTextBox @bind-Text="@Position" Enabled="!Unemployed" />
                <DxFormLayoutItem Caption="Hire Date:" ColSpanMd="12">
                    <DxDateEdit @bind-Date="@HireDate" Enabled="!Unemployed" />
                <DxFormLayoutItem Caption="Postal code:" ColSpanMd="12">
                    <DxTextBox @bind-Text="@PostalCode" Enabled="!Unemployed" />
@code {
    static Employee employee;
    string Position { get; set; }
    DateTime? HireDate { get; set; }
    bool Unemployed { get; set; }
    void UnemployedChanged(bool value) {
        if(value) {
            Position = PostalCode = null;
            HireDate = null;
        Unemployed = value;

Custom FL Group Header Content

See Also