Skip to main content

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

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

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:

BootstrapFormLayout_Overview_Example

<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="(000) 000-0000" IncludeLiterals="None" />
                    </dx:BootstrapTextBox>
                </dx:ContentControl>
            </ContentCollection>
        </dx:BootstrapLayoutItem>
    </Items>
</dx:BootstrapFormLayout>
See Also