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>