DxToolbarItem.ChildContent Property

Specifies Toolbar item content.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v25.1.dll

NuGet Package: DevExpress.Blazor

Declaration

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

Property Value

Type	Description
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:

<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.

<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:

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