Можно ли добавить разделитель в узел меню MvcSiteMap?

Я хотел бы иметь возможность добавить разделительную полосу в свое меню, созданное с использованием библиотеки MvcSiteMap.

Узлы mvcSiteMapNodes разрешаются в <li></li> элементов с методом действия внутри. Однако я хотел бы просто фиктивный узел <li class="divider"></li>, который отображает элемент разделителя в моем меню.

e.g.

<mvcSiteMapNode title="Admin" url="#admin" roles="Admin">
  <mvcSiteMapNode title="Edit Users" controller="User" action="Users" roles="Admin" />      
  <mvcSiteMapNode class="divider"  />
  <mvcSiteMapNode title="User Audit" controller="User" action="Audit" roles="Admin" />      
</mvcSiteMapNode>

Кто-нибудь знает, как этого можно достичь?


person jaffa    schedule 19.09.2011    source источник


Ответы (3)


Лучший способ справиться с этим — поместить узел карты сайта-разделителя в файл карты сайта xml и установить для атрибута clickable значение false. Если ему нужен контроллер и/или действие, создайте его специально для разделителя.

Затем создайте собственные шаблоны для рендеринга меню. В шаблонах вы можете изучить модель узла и поместить любые HTML-атрибуты, которые вы хотите, в отображаемый результат. Поэтому, если атрибут кликабельного узла карты сайта имеет значение false, вы можете вставить строку в атрибут класса html и настроить свой стиль css так, как вам нравится.

См. раздел «Настройка отображаемого вывода» по этому адресу: https://github.com/maartenba/MvcSiteMapProvider/wiki/HtmlHelper-functions

<%@ Control Language="C#"Inherits="System.Web.Mvc.ViewUserControl<MvcSiteMapProvider.Web.Html.Models.SiteMapNodeModel>" %>
<%@ Import Namespace="System.Web.Mvc.Html" %>

<% if (Model.IsCurrentNode && Model.SourceMetadata["HtmlHelper"].ToString() != "MvcSiteMapProvider.Web.Html.MenuHelper")  { %>
    <%=Model.Title %>
<% } else if (Model.IsClickable) { %>
<a href="<%=Model.Url %>"><%=Model.Title %></a>
<% } else { %>
<%=Model.Title %>
<% } %>
person JBeckton    schedule 01.06.2012

MvcSiteMap поддерживает атрибут clickable для mvcSiteMapNode, который может отображать пустой

<li> </li> 

но не вижу способа указать класс, и, похоже, требуется действительный контроллер и действие!

Если это нехорошо, JQuery может сделать это за вас....

Учитывая этот html: -

<div id="sitemap">
  <ul>
    <li>Edit Users</li>
    <li>User Audit</li>
    <li>Another Option</li>
    <li>Something else</li>      
  </ul>
</div>

и этот вызов JQuery: -

$('<li class="divider"></li>').appendTo('div#sitemap li:not(:last)');

вы должны получить требуемый результат.

Я создал JSFiddle, чтобы показать, как он работает.

ОБНОВЛЕНИЕ

Хорошо, вот обновленное решение для вставки разделителя в нужное место: -

$('div#sitemap li').last().prev().after('<li class="divider"></li>');

$('<li class="divider"></li>').appendTo('div#sitemap li:nth-child(3)');

$('div#sitemap li:last').prev().after('<li class="divider"></li>');

JSFiddle обновлен, чтобы показать все эти

person Andy Robinson    schedule 26.09.2011
comment
Спасибо за ваш ответ, но похоже, что разделитель создается для каждого элемента. Мне нужно, чтобы разделитель был специально помещен в список. Вспомните меню «Справка» в приложениях для Windows. Элемент «о» часто отделяется от остальных разделителем. - person jaffa; 27.09.2011
comment
Я вижу, не понял этого. Я обновил ответ и JSFiddle с помощью 3 методов, чтобы разделитель отображался перед последним элементом. - person Andy Robinson; 27.09.2011
comment
хорошо, спасибо, было бы неплохо, если бы я мог каким-то образом указать позицию в файле mvcsitemap, может быть, фиктивный, который указывает фиктивный контроллер/действие, которое затем заменяется разделителем. Может быть, я слишком много прошу! Другой вариант — добавить функцию в сам MvcSiteMap;) - person jaffa; 28.09.2011
comment
Да, добавление функции самостоятельно - это один из вариантов. Если вы довольны наличием фиктивного контроллера/действия, вы можете изменить шаблоны отображения, чтобы найти фиктивный и отобразить код, который вы хотите: - ‹mvcSiteMapNode title=divider/dummy/whatever /› - person Andy Robinson; 28.09.2011
comment
а затем в MenuHelperModel.cshtml я изменил код, чтобы проверить заголовок @foreach (узел var в Model.Nodes) { if (node.Title == разделитель) { ‹li class=divider›‹/li› } else { ‹li ›@Html.DisplayFor(m =› узел)‹/li› } } - person Andy Robinson; 28.09.2011

Если вы установите заголовок как «Разделитель» и кликните на «false», узел будет отображаться в виде линии.

<mvcSiteMapNode title="Separator" clickable="false" />
person Matthew Early    schedule 06.11.2015