---
title: "Highlighting the menu item."  
description: "Highlighting the menu item."  
author: "Munikumar G"  
published: 2011-11-01  
updated: 2011-12-26  
canonical: https://www.mindstick.com/forum/339/highlighting-the-menu-item  
category: "asp.net mvc"  
tags: ["asp.net mvc"]  
reading_time: 4 minutes  

---

# Highlighting the menu item.

Hi,

I am using Menu [controls](https://www.mindstick.com/articles/66/how-to-create-controls-at-run-time-in-csharp-dot-net) like this.how can i highlighting the menu [item](https://www.mindstick.com/forum/156564/remove-item-in-an-array-in-javascript) here.

```
<% @ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %><%if (Request.IsAuthenticated) {%>Welcome<b><%: Page.User.Identity.Name %></b>![ <%: Html.ActionLink("Log Off", "LogOff", "Account") %> ]<%}else {%><ul id="top-navigation"><li><span><span><%: Html.ActionLink("Dashboard", "Index", "AppHome")%></span></span></li><li><span><span><%: Html.ActionLink("Index", "Index", "AppHome")%></span></span></li>  	<li><span><span><%: Html.ActionLink("About", "About", "AppHome")%></span></span></li></ul><%}%>
```

In site.master using like this.

<% [Html.RenderPartial](https://www.mindstick.com/forum/2318/what-is-the-difference-between-html-partial-and-html-renderpartial-and-html-action-and-html-renderaction)(

"LogOnUserControl"); %></div>

Thanks

Munikumar

## Replies

### Reply by Munikumar G

Hi,

I am using this code for MenuItem highlighting.It's working..........

1.Site.Mater

<% Html.RenderPartial("MenuControl"); %>

2.MenuControl.ascx

<ul id="top-navigation">\
<li><%: Html.ActionMenu("Campaigns", "Index", " Home ")%></li>\
<li><%: Html.ActionMenu(" Campaigns", "Index", "Home")%></li>\
<li><%: Html.ActionMenu("Mails", "Index", "Home")%></li>\
<li><%: Html.ActionMenu("My Reports", "Index", " Home ")%></li>\
</ul>\

3.Then create new folder in app. Name like Html

namespace EMM360.Html\
{\
public class Extention\
{\
public static Dictionary<Menu, Menu> GetDictionary()\
{\
Dictionary<Menu, Menu> urls = new Dictionary<Menu, Menu>();\
urls.Add(new Menu { Controller = "AppHome", Action = "Index" }, new Menu { Controller = "AppHome", Action = "Index" });\
urls.Add(new Menu { Controller = "Email", Action = "Index" }, new Menu { Controller = "Email", Action = "Index" });\
\
return urls;\
}\
}\
public static class HtmlExtensions\
{\
public static MvcHtmlString ActionMenu(this HtmlHelper helper,String linkText,string actionName,String controllerName)\
{\
var tag= new TagBuilder("li");\
if(helper.ViewContext.RequestContext.IsCurrentRoute(null,controllerName,actionName)||\
helper.ViewContext.RequestContext.IsParentRoute(controllerName,actionName))\
{\
tag.AddCssClass("active");\
}\
else\
{\
tag.AddCssClass("inactive");\
}\
tag.InnerHtml = helper.ActionLink(linkText, actionName, controllerName).ToString();\
return MvcHtmlString.Create(tag.ToString());\
}\
}\
public static class RequestExtentions\
{\
public static bool IsCurrentRoute(this RequestContext context, String areaName)\
{\
return context.IsCurrentRoute(areaName, null, null);\
}\
public static bool IsCurrentRoute(this RequestContext context, String areaName, String controllerName)\
{\
return context.IsCurrentRoute(areaName, controllerName, null);\
}\
public static bool IsCurrentRoute(this RequestContext context, String areaName, String controllerName, params String[] actionNames)\
{\
var routeData = context.RouteData;\
var routeArea = routeData.DataTokens["area"] as String;\
var current = false;\
\
if (((String.IsNullOrEmpty(routeArea) && String.IsNullOrEmpty(areaName)) || (routeArea == areaName)) &&\
((String.IsNullOrEmpty(controllerName)) || (routeData.GetRequiredString("controller") == controllerName)) &&\
((actionNames == null) || actionNames.Contains(routeData.GetRequiredString("action"))))\
{\
current = true;\
}\
return current;\
}\
public static bool IsParentRoute(this RequestContext context, String controller, String action)\
{\
var routeData = context.RouteData;\
Menu returnUrl = null;\
Menu requestUrl = new Menu { Action = routeData.GetRequiredString("action"), Controller = routeData.GetRequiredString("controller") };\
Menu linkUrl = new Menu { Action = action, Controller = controller };\
\
var urls = Extention.GetDictionary();\
urls.TryGetValue(requestUrl, out returnUrl);\
\
if (returnUrl != null && returnUrl.Equals(linkUrl))\
return true;\
else\
return false; ;\
}\
}\
}

\

\

4. Create Menu Model

public string Text { get; set; }\
public string Action { get; set; }\
public string Controller { get; set; }\
\
public override bool Equals(object obj)\
{\
return base.Equals(obj as Menu);\
}\
public bool Equal(Menu obj)\
{\
return obj != null && obj.Action == this.Action && obj.Controller == this.Controller;\
}\
public override int GetHashCode()\
{\
return (Action + Controller).GetHashCode();\
}

\

Thanks

G Munikumar

### Reply by Chris Anderson

hi,\
\
You can modify the look of menus with the help of css that how menu look initially and react after selecting.\
have you got your answer?

### Reply by Munikumar G

Hi,

Thanks Rohit.

Please check this URL :http://arturito.net/2011/08/03/asp-net-mvc-2-highlight-selected-menu-item-on-the-site-master-without-session/

I want this type of menu item highlighting...........

Thanks

Munikumar

### Reply by Chris Anderson

Hi Muni,\
\
First you have to create class in css, as given below:\
\

```
    <style type="text/css">        .required        {            text-decoration:none;        }        .required:hover        {            background-color:Blue;            color:White;        }    </style>
```

\
After creating css, apply css class in ActionLink control:\
\
<%: Html.ActionLink("Home", "Index", "Home", new { @class = "required" })%>\

### Reply by Munikumar G

Hi,

Thanks Rohit.

But selected menu item how to create.

## Thanks

## Munikumar

### Reply by Chris Anderson

Hi,\
\
You can highlight menu item by using CSS.\
**For eg.**\
\

```
<html><head runat="server">    <title>Index</title>    <style type="text/css">        .required        {            text-decoration:none;        }        .required:hover        {            background-color:Blue;            color:White;        }        li        {            list-style-type:none;            display:inline;            margin-left:10px;        }    </style></head><body>    <div>        <ul>            <% foreach (var hobby in ViewBag.Hobbies) { %>            <li>                <font color="blue"><%: Html.ActionLink((string)hobby, "Index", "Home", new { @class = "required" })%></font>            </li>            <% } %>        </ul>    </div></body></html>
```


---

Original Source: https://www.mindstick.com/forum/339/highlighting-the-menu-item

Copyright © MindStick Software Pvt. Ltd. This Markdown version is provided for developers, AI systems, and offline reading.