Proveedor MVC SiteMap, muestra el menú principal para el elemento de menú oculto

Question

Estoy usando MVC SiteMap Provider para crear un menú para mi sitio web y resaltar el elemento del menú actual.

En mi controlador tengo un método de Índice, Detalles, Agregar, Editar y Eliminar.Sólo los métodos Index y Add están disponibles como elemento de menú.

Todavía me gustaría resaltar el elemento del menú principal actual (es decir, Productos) cuando estoy en la acción Detalles.¿Cómo puedo hacer eso?

Lo intenté:

<mvcSiteMapNode title="Details" action="Details" visibility="IfSelected,!*" />

Pero eso no resalta el menú y Detalles está en el menú aunque no lo quiero.

Entonces lo intenté

<mvcSiteMapNode title="Details" action="Details" visibility="IfSelected,!*" preservedRouteParameters="id" />

Lo que resalta el submenú Detalles, pero prefiero tener el submenú Detalles oculto en el menú y solo tener resaltado el elemento del menú principal ("Proyectos").

Answer 1

En realidad, hay dos cosas distintas que aparentemente estás intentando lograr, pero las has combinado en una sola pregunta.

En primer lugar, para realizar operaciones CRUD, echa un vistazo al artículo. Cómo hacer que MvcSiteMapProvder recuerde la posición de un usuario y el acompañamiento demostraciones descargables.Específicamente, mire la demostración titulada MvcSiteMapProvider-Forzar-una-coincidencia porque demuestra exactamente cómo anidar los nodos, forzarlos a coincidir con la solicitud actual, configurar la visibilidad y cambiar dinámicamente el título de los nodos según el registro que haya seleccionado.

La segunda parte de su pregunta trata realmente sobre cambiar el HTML de salida para resaltar un elemento del menú, lo que no puede hacer utilizando ninguna de las funciones integradas.Para eso, debe editar el archivo /Views/Shared/DisplayTemplates/SiteMapNodeModel.cshtml directamente.El paquete NuGet agrega este archivo a su proyecto MVC y debe tener cuidado de no sobrescribir los cambios cuando actualice.Tenga en cuenta que este archivo lo comparten los ayudantes HTML Menú, SiteMap y SiteMapPath, por lo que debe hacer una copia para el menú o tenga cuidado de utilizar siempre lógica de ramificación para los ayudantes HTML específicos que desea editar.

Para determinar el nodo coincidente más cercano a la página actual, necesita este código de afeitar.

@{var isClosestVisibleMenuItem = false;}
@if ((Model.IsCurrentNode || (Model.IsInCurrentPath && !Model.IsRootNode && !Model.Descendants.Any())) 
    && Model.SourceMetadata["HtmlHelper"].ToString() == "MvcSiteMapProvider.Web.Html.MenuHelper")
{
    isClosestVisibleMenuItem = true;
}

Tenga en cuenta que el valor SourceMetadata se verifica para garantizar que nos referimos al Menú; todos los demás asistentes HTML siempre establecerán la variable isClosestVisibleMenuItem en falso.

Entonces es sólo cuestión de usar la variable para indicarle a la plantilla qué HTML generar.Aquí hay un ejemplo que pone un <b></b> alrededor del nodo visible más cercano en el menú únicamente.En un ejemplo del mundo real, probablemente querrás agregar una clase CSS específica a la etiqueta de anclaje para resaltarla.

@model MvcSiteMapProvider.Web.Html.Models.SiteMapNodeModel
@using System.Web.Mvc.Html
@using MvcSiteMapProvider.Web.Html.Models

@{var isClosestVisibleMenuItem = false;}
@if ((Model.IsCurrentNode || (Model.IsInCurrentPath && !Model.IsRootNode && !Model.Descendants.Any())) && Model.SourceMetadata["HtmlHelper"].ToString() == "MvcSiteMapProvider.Web.Html.MenuHelper")
{
    isClosestVisibleMenuItem = true;
}

@if (Model.IsCurrentNode && Model.SourceMetadata["HtmlHelper"].ToString() != "MvcSiteMapProvider.Web.Html.MenuHelper")  { 
    <text>@Model.Title</text>
} else if (Model.IsClickable) {

    if (isClosestVisibleMenuItem)
    {
        <b>
        @if (string.IsNullOrEmpty(Model.Description))
        {
            <a href="@Model.Url">@Model.Title</a>
        }
        else
        {
            <a href="@Model.Url" title="@Model.Description">@Model.Title</a>
        }
        </b>
    }
    else
    {
        if (string.IsNullOrEmpty(Model.Description))
        {
            <a href="@Model.Url">@Model.Title</a>
        }
        else
        {
            <a href="@Model.Url" title="@Model.Description">@Model.Title</a>
        }
    }
} else {
    if (isClosestVisibleMenuItem)
    {
        <b>@Model.Title</b>
    }
    else
    {
        <text>@Model.Title</text>   
    }
}

IfSelected es para un caso de uso específico en el que tiene una jerarquía profunda y desea mostrar la ruta actual (sin importar cuán profunda sea) mientras mantiene el resto del menú en un nivel alto.Normalmente, esto sólo se aplicaría al Menú, a ninguno de los otros asistentes HTML.Pero nada en su pregunta implica que eso sea lo que está tratando de lograr.