ASPxMenuBase.RootItemTextTemplate Property

Gets or sets a common template used for displaying the text content of all root menu items within a menu control.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v24.1.dll

NuGet Package: DevExpress.Web

Declaration

C#

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

VB.NET

<DefaultValue(Nothing)>
Public Overridable Property RootItemTextTemplate As ITemplate

Property Value

Type	Default	Description
ITemplate	null	An object supporting the ITemplate interface which contains the template used for displaying the text content of all root menu items within a menu.

Remarks

Use the RootItemTextTemplate property to define the common content for all root menu items within a menu control. The template created using this property replaces the text content of each root menu item - in particular, the item’s text specified.

Note that any style settings defined for the root menu items via specific properties (such as the ASPxMenuBase.ItemStyle) are still in effect for the root menu items whose contents are specified, using the RootItemTextTemplate property.

The text content of an individual menu item can be defined using the item’s MenuItem.TextTemplate property. A text template for submenu items can be specified via the ASPxMenuBase.ItemTextTemplate property.

Note

Once a template defined via the RootItemTextTemplate property is created within a menu, 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 RootItemTextTemplate cannot contain another menu control.

Example

This part of the Tabbed Menu demo illustrates how to customize the ASPxMenu control as a hierachical menu (with popped out submenus) which looks like a set of tabs.

Gradient borders for the menu’s root items (tabs) are drawn by using the RootItemTextTemplate property. The control’s style settings are defined via the ASPxMenuBase.ItemStyle property, ASPxMenuBase.SubMenuStyle property,etc.

ASPX

...
<dxm:ASPxMenu EnableTheming="False" ID="ASPxMenu1" CssClass="TabbedMenu" 
runat="server" AppearAfter="0" DataSourceID="XmlDataSource1" ItemSpacing="0px" 
SeparatorHeight="28px" SeparatorWidth="1px" ShowSubMenuShadow="False" 
BorderBetweenItemAndSubMenu="HideRootOnly" Font-Names="Tahoma" Font-Size="8pt" 
Font-Underline="False" ForeColor="Black" AutoPostBack="True" SyncSelectionMode="None" 
ClientInstanceName="tabbedMenu" AllowSelectItem="True" SelectParentItem="True">
     <ItemStyle CssClass="rootItem" Wrap="False">
         <BackgroundImage ImageUrl="~/Menu/Images/TabbedMenu/RootItemSeparator.gif" 
         Repeat="NoRepeat" HorizontalPosition="right" />
         <Paddings Padding="0px" />
         <HoverStyle CssClass="rootItemHover">
         </HoverStyle>
         <SelectedStyle CssClass="rootItemSelected">
         </SelectedStyle>
     </ItemStyle>
     <Paddings Padding="0px" />
     <Border BorderStyle="None" />
     <RootItemSubMenuOffset X="-1" Y="-2" FirstItemX="-1" FirstItemY="-2" LastItemX="-1"
         LastItemY="-2" />
     <SubMenuStyle GutterWidth="0px" ItemSpacing="0px" BackColor="White" CssClass="menu">
         <Paddings Padding="1px" />
         <Border BorderColor="#919191" BorderStyle="Solid" BorderWidth="1px" />
     </SubMenuStyle>
     <SubMenuItemStyle Wrap="False">
         <HoverStyle BackColor="#EDEDED">
             <Border BorderWidth="0px" />
         </HoverStyle>
         <Paddings Padding="5px" PaddingLeft="7px" PaddingRight="7px" />
     </SubMenuItemStyle>
     <VerticalPopOutImage Height="5px" Url="~/Menu/Images/TabbedMenu/ItemArrow.gif" 
     Width="4px" />
     <ItemSubMenuOffset X="-1" Y="-2" FirstItemY="-3" LastItemY="-2" />
     <LinkStyle Color="Black">
         <Font Underline="False"></Font>
     </LinkStyle>
     <RootItemTextTemplate>
         <div><table cellpadding="0" cellspacing="0" border="0"><tr>
         <th class="WhiteBorderRight">
         <dxe:ASPxLabel ID="lblText" runat="server" EnableTheming="False" Text='<%# Eval("Text") %>' />
         </th></tr></table></div>
     </RootItemTextTemplate>
 </dxm:ASPxMenu>
...