Item Link Mode

• Aug 01, 2019

The MenuSettingsBase.ItemLinkMode property specifies how menu items are represented as links within the menu. By default, this property is set to ContentBounds, which makes the menu entirely interactive. If you need to display a simple menu (such as a set of single level links), you can set the ItemLinkMode property to TextOnly or TextAndImage. In this instance, the resulting HTML code generated to represent the menu on the page will be minimal.

The image below shows two Menus in two link modes - ContentBounds and TextOnly.

The code sample below demonstrates how you can specify an item link mode for a menu.

View code (ASPX):

C#

<%
    Html.DevExpress().Menu(
        settings => {
            settings.Name = "MyMenu";
            settings.ItemLinkMode = ItemLinkMode.TextOnly;
            settings.AutoSeparators = AutoSeparatorMode.RootOnly;
            settings.Styles.Style.SeparatorWidth = 1;
            settings.Styles.Style.SeparatorHeight = 14;
            settings.Styles.Style.SeparatorColor = System.Drawing.Color.Black;
            settings.Styles.Style.SeparatorPaddings.PaddingLeft = 10;
            settings.Styles.Style.SeparatorPaddings.PaddingRight = 10;
            settings.Styles.Style.Font.Underline = false;
            settings.Styles.Link.HoverStyle.Font.Underline = true;

            ...

        })
         .Render();
    %>

View code (Razor):

C#

@Html.DevExpress().Menu(
    settings => {
        settings.Name = "MyMenu";
        settings.ItemLinkMode = ItemLinkMode.TextOnly;
        settings.AutoSeparators = AutoSeparatorMode.RootOnly;
        settings.Styles.Style.SeparatorWidth = 1;
        settings.Styles.Style.SeparatorHeight = 14;
        settings.Styles.Style.SeparatorColor = System.Drawing.Color.Black;
        settings.Styles.Style.SeparatorPaddings.PaddingLeft = 10;
        settings.Styles.Style.SeparatorPaddings.PaddingRight = 10;
        settings.Styles.Style.Font.Underline = false;
        settings.Styles.Link.HoverStyle.Font.Underline = true;
        ...
    }).GetHtml()