Question

我希望能够在我的菜单中添加一个使用MvcSiteMap库创建的分隔栏。

mvcSiteMapNodes使用action方法解析为<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>

有谁知道如何实现这一目标？

Answer 1

处理此问题的最佳方法是将分隔符sitemap节点放在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 %>
<% } %>

Answer 2

MvcSiteMap支持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已更新，以显示所有这些

Answer 3

如果您将标题设置为“分隔符”并可单击为“假”，则该节点将显示为一行

<mvcSiteMapNode title="Separator" clickable="false" />

是否可以在MvcSiteMap菜单节点中添加分隔符？

3 个答案: