Loading...
Area: Episerver CMS
Applies to versions: 11.21.1 and higher

How to highlight parent menu items

There are scenarios where an add-on has a few views, but only some of them should be accessible through the menu. For example, the add-on "Email manager" has three views available in its menu:

  • Overview
  • Create email
  • Reports

imageiaadj.png

The menu provider looks like this:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;
using EPiServer.Shell;
using EPiServer.Shell.Navigation;

namespace MyAddon.Emails
{
    [MenuProvider]
    public class EmailsMenuProvider : IMenuProvider
    {
        public IEnumerable<MenuItem> GetMenuItems()
        {
            // parent
            var emailsSection = new SectionMenuItem("Email manager", "/global/emails")
            {
                IsAvailable = (request) => true
            };

            var overview = new UrlMenuItem("Overview", "/global/emails/overview", ResolveMenuUrl("Overview"))
            {
                IsAvailable = (request) => true,
                SortIndex = 100
            };
            var create = new UrlMenuItem("Create email", "/global/emails/create", ResolveMenuUrl("Create"))
            {
			    IsAvailable = (request) => true,
                SortIndex = 200
            };
            var reports = new UrlMenuItem("Reports", "/global/emails/reports", ResolveMenuUrl("Reports"))
            {
                IsAvailable = (request) => true,
                SortIndex = 300
            };
			
			public static string ResolveMenuUrl(string item)
            {
                var moduleUrl = Paths.ToResource(typeof(ModuleHelper), string.Empty);
				return UriSupport.Combine(ModulePath, item);
            }

            return new MenuItem[]
            {
                emailsSection,
                overview,
                create,
                reports,
            };
        }
    }
}

Create email is a form with a regular submit button. After a user sends an email, they are redirected to the Mail sent confirmation page, which is not rendered in the menu; however, it should have the Create email menu item highlighted.

To do this, the Mail sent view should also be added to the provider with its path based on the Create email path (/global/emails/create/mailsent) and the IsAvailable option set to false. Then, the option is not rendered in the menu, but will highlight its direct parent.

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;
using System.Web.Routing;
using EPiServer.Shell;
using EPiServer.Shell.Navigation;

namespace MyAddon.Emails
{
    [MenuProvider]
    public class EmailsMenuProvider : IMenuProvider
    {
        public IEnumerable<MenuItem> GetMenuItems()
        {
            // parent
            var emailsSection = new SectionMenuItem("Email manager", "/global/emails")
            {
                IsAvailable = (request) => true
            };

            var overview = new UrlMenuItem("Overview", "/global/emails/overview", ResolveMenuUrl("Overview"))
            {
                IsAvailable = (request) => true,
                SortIndex = 100
            };
            var create = new UrlMenuItem("Create email", "/global/emails/create", ResolveMenuUrl("Create"))
            {
			    IsAvailable = (request) => true,
                SortIndex = 200
            };
            var reports = new UrlMenuItem("Reports", "/global/emails/reports", ResolveMenuUrl("Reports"))
            {
                IsAvailable = (request) => true,
                SortIndex = 300
            };

            var mailSent = new UrlMenuItem(string.Empty, "/global/emails/create/mailsent", ResolveMenuUrl("ResendMessage"))
            {
                IsAvailable = (request) => false,
                SortIndex = 400
            };
			
			public static string ResolveMenuUrl(string item)
            {
                var moduleUrl = Paths.ToResource(typeof(ModuleHelper), string.Empty);
				return UriSupport.Combine(ModulePath, item);
            }

            return new MenuItem[]
            {
                emailsSection,
                overview,
                create,
                reports,
				mailSent
            };
        }
    }
}

Last updated: Jul 29, 2019