Skip to main content
A newer version of this page is available. .
Tab

MenuItem.SubMenuTemplate Property

Gets or sets a template used for displaying the client region’s content of the current menu item’s submenus.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v19.2.dll

Declaration

[DefaultValue(null)]
public virtual ITemplate SubMenuTemplate { get; set; }

Property Value

Type Default Description
ITemplate *null*

An object supporting the System.Web.UI.ITemplate interface which contains the template used for displaying the client regions of all submenus of the current menu item.

Remarks

Use the SubMenuTemplate property to define the common content for the client regions of all submenus of the current menu item. A submenu’s client region is considered as an area where menu items are displayed - it involves the menu items, separators and gutters. The template created using the SubMenuTemplate property fills the entire client region of each submenu of the menu item.

The SubMenuTemplate property is useful when it is required to display a specific control within a particular menu item’s submenus. Placing a control onto the template container causes the control be displayed within a submenu when the submenu is invoked.

Note that any style settings defined for the client regions of the submenus via specific properties (such as the ASPxMenuBase.SubMenuStyle or MenuItem.SubMenuStyle) are still in effect for the submenus whose contents are specified using the SubMenuTemplate property.

The client region’s content of all submenus within a menu control can be defined using the menu’s ASPxMenuBase.SubMenuTemplate property.

Note

Once a template defined via the SubMenuTemplate property is created within a tab control, it is instantiated within a container object of the MenuItemTemplateContainer type. This container object exposes a set of specific properties to which the template’s child controls can be bound.

Note

An SubMenuTemplate cannot contain another menu control.

Example

This part of the Templates demo illustrates how to use template technology within the ASPxMenu control.

A specific MenuItem.SubMenuTemplate property is used to define the template for the first root menu item’s submenu. The content of a SubMenuTemplate type is represented by the ASPxSiteMapControl, which displays a hierarchical structure of links (site map nodes) that reference different web pages within the site.

The appearance of the second root menu item’s sub-item is defined via the MenuItem.Template property of each sub-item.

<dxm:ASPxMenu BorderBetweenItemAndSubMenu="HideRootOnly" EnableViewState="False" 
EnableClientSideAPI="true" ID="ASPxMenu1" AutoSeparators="None" runat="server" 
ShowSubMenuShadow="true" ItemImagePosition="Right" GutterWidth="0px" 
ShowPopOutImages="True">
    <Items>
        <dxm:MenuItem Text="SubMenu Template" Name="submenu">
        <Items>
            <dxm:MenuItem />
        </Items>             
        <SubMenuTemplate>
            <dxsm:ASPxSiteMapControl EnableViewState="False" ID="ASPxSiteMapControl1" 
            runat="server" DataSourceID="ASPxSiteMapDataSource1">
              ...
            </dxsm:ASPxSiteMapControl>         
       </SubMenuTemplate>
        </dxm:MenuItem>
        <dxm:MenuItem Text="Item Template" Name="item">                                            
            <SubMenuStyle Paddings-Padding="8px" Font-Size="10px" Font-Names="Verdana" 
            Wrap="False" ForeColor="#000000" />
            <Items>
             ...
                <dxm:MenuItem Text="Email" Name="email" BeginGroup="true">
                    <Template>
                    <dxe:ASPxLabel ID="Label2" EnableViewState="false" 
                    AssociatedControlID="TextBox1" runat="server" 
                    Text="<%# Container.Item.Text %>" Font-Size="10px" 
                    ForeColor="#003399" Font-Bold="true" />
                    <table border="0" cellpadding="0" cellspacing="0" 
                    style="margin-top: 4px;" width="260px">
                        <tr>
                            <td style="width: 100%;"><dxe:ASPxTextBox ID="TextBox1" 
                             runat="server" EnableViewState="false" Width="100%" />
                            </td>
                            <td style="padding-left: 3px;"><dxe:ASPxButton ID="Button1" 
                            runat="server" EnableViewState="False" Text="Subscribe" 
                            AutoPostBack="False">
                            <ClientSideEvents Click="function(s, e) {
                             ASPxClientMenuBase.GetMenuCollection().HideAll(); return false;
                            }" />
                            </dxe:ASPxButton></td>
                        </tr>
                    </table>                                                
                    </Template>
                </dxm:MenuItem>
            </Items>
        </dxm:MenuItem>
    </Items> </dxm:ASPxMenu>
See Also