Back to Devexpress

DxToolbarItem.ChildContent Property

blazor-devexpress-dot-blazor-dot-dxtoolbaritem.md

latest2.1 KB
Original Source

DxToolbarItem.ChildContent Property

Specifies Toolbar item content.

Namespace : DevExpress.Blazor

Assembly : DevExpress.Blazor.v25.2.dll

NuGet Package : DevExpress.Blazor

Declaration

csharp
[Parameter]
public RenderFragment<IToolbarItemInfo> ChildContent { get; set; }

Property Value

TypeDescription
RenderFragment<IToolbarItemInfo>

Content markup.

|

Remarks

The ChildContent component parameter can store custom component content that does not belong to other component’s RenderFragment properties as shown below:

razor
<DxToolbar>
    <Items>
        <DxToolbarItem>
            <ChildContent>
                This is an item with ChildContent
            </ChildContent>
        </DxToolbarItem>
    </Items>
</DxToolbar>

Note

A toolbar item is rendered as a button HTML element. According to HTML specification a button must not contain interactive elements or elements with the tabindex attribute specified.

Use the Template property to add interactive elements in a toolbar item.

razor
<DxToolbarItem>
    <Template>
        <DxSearchBox CssClass="search py-0" aria-label="Search" />
    </Template>
</DxToolbarItem>

You can omit the <ChildContent> tag and specify the markup directly in the <DxToolbarItem> tag:

razor
<DxToolbar>
    <Items>
        <DxToolbarItem>
            This is an item with ChildContent
        </DxToolbarItem>
    </Items>
</DxToolbar>

See Also

DxToolbarItem Class

DxToolbarItem Members

DevExpress.Blazor Namespace