ASP.NET: Resalte el elemento del menú de la página actual

He estado tratando de encontrar una manera fácil de resaltar el elemento de menú seleccionado actual de un menú asp.net (para que el usuario sepa en qué página están), pero no importa lo que haya intentado, no puedo hacerlo funcionar . En mi marcado tengo:

         

Y en la función Page_Load del lado del servidor:

 ((Menu)Master.FindControl("NavigationMenu")).Items[0].Selected = true; 

Pero esto no funciona. Intenté usar un mapa del sitio (aunque un mapa del sitio no es lo que quiero usar) y eso tampoco funcionó. ¿Algunas ideas?

Hay una propiedad StaticSelectedStyle que puedes usar dentro de tu menú.

   [...]  

Mira aquí para más información .

Además, si hay una clase aplicada al elemento seleccionado (que no estoy seguro si existe pero sería útil) simplemente puede enganchar eso con su CSS. Esta sería una forma mucho más agradable que usar la propiedad StaticSelectedStyle .

ACTUALIZAR

También vale la pena señalar que el uso de IncludeStyleBlock="false" evitará que su menú genere el CSS necesario para controlar el elemento seleccionado.

Con el bloque de estilo desactivado, debe proporcionar sus propios estilos y no se usarán los estilos autogenerados del menú.

Desde MSDN:

Si establece esta propiedad en falso, no puede establecer propiedades de estilo. Por ejemplo, no puede agregar un atributo DynamicHoverStyle-ForeColor en el marcado o establecer la propiedad DynamicHoverStyle.ForeColor en el código.

Fuente: http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.menu.includestyleblock.aspx

Creo que tendrá que recorrer los elementos del menú y ver si la URL de la página actual contiene el elemento NavigateUrl del menú.

 foreach (MenuItem item in mn.Items) { if (Request.Url.AbsoluteUri.ToLower().Contains(Page.ResolveUrl(item.NavigateUrl.ToLower())) { item.Selected = true; } } 

Yo usaría jQuery en esta instancia.

Para la página especificada, por ejemplo, en la página Analysis.aspx, agregue este bit de jquery a su página.

 $('#MenuItemID').addClass('active'); 

¿Puedes especificar la ID de los elementos del menú?

Como:

  

Entonces usarías esto:

 $('#' + <% AnalysisMenuItem.ClientID %>').addClass('active'); 

entonces, por supuesto, solo defina qué active tiene su css:

 .active { background-color: #FFF; } 

Si estás pensando en hacerlo dinámicamente, entonces esta es la mejor manera:

 Menu MyMenu = new Menu(); .... MyMenu.MenuItemDataBound += new MenuEventHandler(MyMenu_MenuItemDataBound); TheMenu.StaticSelectedStyle.CssClass ="MySelectedClass"; protected void MyMenu_MenuItemDataBound(Object sender, MenuEventArgs e) { if (e.Item.NavigateUrl.ToLower().Contains(Path.GetFileName(Request.FilePath).ToLower())) { //e.Item.Text = "
" + e.Item.Text + "
"; e.Item.Selected = true; } }

agregue luego simplemente agregue el estilo .MySelectedClass a su archivo Css.

 //Master         //Master.cs foreach (MenuItem item in ((Menu)this.FindControl("NavigationMenu")).Items) { if(Request.Url.AbsoluteUri.ToLower().Contains(item.NavigateUrl.ToLower().Substring(1))) { item.Selected = true; } } 

//item.NavigateUrl.ToLower () contiene “~”. Entonces, encuentra la subcadena y el cheque.