Skip to main content
Tab

ASPxMenuBase.AutoSeparators Property

Gets or sets a value that specifies the manner in which a specific separator is displayed to separate menu items from each other.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v24.1.dll

NuGet Package: DevExpress.Web

Declaration

[DefaultValue(AutoSeparatorMode.None)]
public virtual AutoSeparatorMode AutoSeparators { get; set; }

Property Value

Type Default Description
AutoSeparatorMode None

An AutoSeparatorMode enumeration value.

Available values:

Name Description
All

Specifies that separators are automatically displayed at all menu levels to separate menu items from each other.

RootOnly

Specifies that separators are automatically displayed only at the root menu level to separate the root menu items from each other.

None

Specifies that separators are not displayed automatically. In order to display a separator before a particular menu item, the item’s MenuItem.BeginGroup property should be used.

Remarks

The appearance of separators can be defined either at the menu control level by using specific properties (such as the ASPxMenuBase.SeparatorBackgroundImage, ASPxMenuBase.SeparatorColor, ASPxMenuBase.SeparatorPaddings and ASPxMenuBase.SeparatorWidth) or at the level of the MenuStyle object using the corresponding properties (such as the MenuStyle.SeparatorBackgroundImage, MenuStyle.SeparatorColor, MenuStyle.SeparatorPaddings, MenuStyle.SeparatorStyle and MenuStyle.SeparatorWidth).

Note

The AutoSeparators property value might be explicitly defined in some themes, so specifying it has no effect.

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