Skip to main content

DevExpress v24.2 Update — Your Feedback Matters

Our What's New in v24.2 webpage includes product-specific surveys. Your response to our survey questions will help us measure product satisfaction for features released in this major update and help us refine our plans for our next major release.

Take the survey Not interested

DxToolbarItem.ChildContent Property

Specifies Toolbar item content.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v24.2.dll

NuGet Package: DevExpress.Blazor

#Declaration

C#
[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:

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

Item with child content

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:

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