BootstrapFormLayout.Items Property

Provides access to the Form Layout control’s item collection.

Namespace: DevExpress.Web.Bootstrap

Assembly: DevExpress.Web.Bootstrap.v24.1.dll

NuGet Package: DevExpress.Web.Bootstrap

Declaration

C#

[PersistenceMode(PersistenceMode.InnerProperty)]
public BootstrapLayoutItemCollection Items { get; }

VB.NET

<PersistenceMode(PersistenceMode.InnerProperty)>
Public ReadOnly Property Items As BootstrapLayoutItemCollection

Property Value

Type	Description
BootstrapLayoutItemCollection	A BootstrapLayoutItemCollection object that is a collection of layout items.

Example

This example demonstrates the basic functionality of Form Layout.

• Initialize new instance of the BootstrapFormLayout class.
• Add required BootstrapLayoutItem objects to the BootstrapFormLayout.Items collection.
• Fill each layout item with the necessary content controls - ContentCollection items.

The image below shows the result:

ASPX

<dx:BootstrapFormLayout runat="server">
    <Items>
        <dx:BootstrapLayoutItem Caption="Contact Name" ColSpanMd="6">
            <ContentCollection>
                <dx:ContentControl>
                    <dx:BootstrapTextBox runat="server" Text="Thomas Hardy" />
                </dx:ContentControl>
            </ContentCollection>
        </dx:BootstrapLayoutItem>
        <dx:BootstrapLayoutItem Caption="Company Name" ColSpanMd="6">
            <ContentCollection>
                <dx:ContentControl>
                    <dx:BootstrapTextBox runat="server" Text="Around the Horn" />
                </dx:ContentControl>
            </ContentCollection>
        </dx:BootstrapLayoutItem>
        <dx:BootstrapLayoutItem Caption="Title" ColSpanMd="6">
            <ContentCollection>
                <dx:ContentControl>
                    <dx:BootstrapTextBox runat="server" Text="Sales Representative" />
                </dx:ContentControl>
            </ContentCollection>
        </dx:BootstrapLayoutItem>
        <dx:BootstrapLayoutItem Caption="Phone Number" ColSpanMd="6">
            <ContentCollection>
                <dx:ContentControl>
                    <dx:BootstrapTextBox Text="1715557788" runat="server">
                        <MaskSettings Mask="[phone]" IncludeLiterals="None" />
                    </dx:BootstrapTextBox>
                </dx:ContentControl>
            </ContentCollection>
        </dx:BootstrapLayoutItem>
    </Items>
</dx:BootstrapFormLayout>