Skip to main content

DxMenuItem.SubMenuTemplate Property

Specifies the template that defines the layout and appearance of the menu item’s submenu.

Namespace: DevExpress.Blazor

Assembly: DevExpress.Blazor.v22.1.dll


public RenderFragment<IMenuItemInfo> SubMenuTemplate { get; set; }

Property Value

Type Description

The template content.


This property overrides the DxMenu.SubMenuTemplate property’s value.

The following example demonstrates how to use templates to create the Search and User Profile menu items.

<div class="card">
            <DxMenuItem Text="Products" IconCssClass="oi oi-layers">
                    <DxMenuItem Text="Subscriptions / Packs" />
            <DxMenuItem Text="Support" IconCssClass="oi oi-people">
                    <DxMenuItem Text="Knowledge Base" />
            <DxMenuItem CssClass="ml-auto">
                    <div class="container">
                        <input type="text" class="form-control form-control-sm center" placeholder="Search...">
            <DxMenuItem Text="User Profile">
                    <div class="oi oi-person" />
                    <div class="w-100">
                        <div class="flex-column align-items-center justify-content-center">
                            <div class="logo-container d-flex align-items-center justify-content-center mt-2">
                                <div class="oi oi-person text-muted h1" />
                            <div class="user-name-container bm-3 mb-2">
                                <div class="user-name-title text-muted text-center">User Name</div>
                                <div class="user-name text-center">John Heart</div>
                            <div class="d-flex justify-content-center mb-2">
                                <DxButton Text="Log Off" RenderStyle="@ButtonRenderStyle.Secondary"></DxButton>


Run Demo: Menu - Templates

See Also