使用C#MVC3 HTML.ActionLink中的渲染引导程序下拉菜单
作者:互联网
因此,我遇到了MVC ActionLink和bootstrap下拉菜单的问题.我成功进行了简单的菜单扩展,在其中我传递了诸如字符串和一个布尔值之类的参数.但是现在我正在尝试制作自己的扩展程序,该扩展程序可以生成Bootstrap Dropdown并将选定的CSS类添加到下拉列表的父级-“ ONEofTHEdropdownITEMSselected”-当下拉列表中的那些项之一被选中时(选择下拉列表项时,它会路由到另一个控制器前可以是几个或多个控制器):
<a href="#" class="dropdown-toggle ONEofTHEdropdownITEMSselected" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
和
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="~/area/controller1">Action1</a></li>
<li><a href="~/area/controller2">Action2</a></li>
</ul>
</li>
以下是我要实现的UI / MenuExtensions.cs-传递两个可以生成引导程序下拉菜单的参数,我可以在该下拉菜单中手动插入新菜单项.
public static class MenuExtensions
{
public static MvcHtmlString MenuItem(
this HtmlHelper htmlHelper,
string text,
string action,
string controller,
string cssClass = "item",
bool isController = false
)
{
var li = new TagBuilder("li");
var routeData = htmlHelper.ViewContext.RouteData;
var currentAction = routeData.GetRequiredString("action");
var currentController = routeData.GetRequiredString("controller");
if ((string.Equals(currentAction, action, StringComparison.OrdinalIgnoreCase) || isController) &&
string.Equals(currentController, controller, StringComparison.OrdinalIgnoreCase))
li.AddCssClass("am-selected");
li.InnerHtml = htmlHelper.ActionLink(text, action, controller, new { Area = "" }, new { @class = cssClass }).ToHtmlString();
return MvcHtmlString.Create(li.ToString());
}
public static MvcHtmlString SelectMenu(
this HtmlHelper htmlHelper,
string cssClass,
SelectMenuItem[] menuItems
)
{
TagBuilder list = new TagBuilder("li")
{
InnerHtml = ""
};
string currentAction = htmlHelper.ViewContext.RouteData.GetRequiredString("action");
string currentController = htmlHelper.ViewContext.RouteData.GetRequiredString("controller");
foreach (SelectMenuItem menuItem in menuItems)
{
TagBuilder li = new TagBuilder("li")
{
InnerHtml = htmlHelper.ActionLink(menuItem.Text, menuItem.Action, menuItem.Controller, null, new { }).ToHtmlString()
};
ul.InnerHtml += li.ToString();
}
return MvcHtmlString.Create(list.ToString());
}
}
这是外部课程
public class SelectMenuItem
{
public string Text { get; set; }
public string Action { get; set; }
public string Controller { get; set; }
public bool IsVisible { get; set; }
public SelectMenuItem()
{
IsVisible = true;
}
}
之后,我的html看起来像这样.
@Html.SelectMenu("dropdown", new []{
new SelectMenuItem{ Text = "ViewOne", Controller = "Controller1", Action = "index", IsVisible = SystemUser.Current().IsAdmin},
new SelectMenuItem{ Text = "ViewTwo", Controller = "Controller2", Action = "index"}
});
问题是SelectMenu仅渲染以下内容:
<li></li>
解决方法:
无需重新发明轮子.使用TwitterBootstrapMVC时,可通过以下语法实现所需的输出:
@using (var dd = Html.Bootstrap().Begin(new DropDown("Dropdown").SetLinksActiveByControllerAndAction()))
{
@dd.ActionLink("Action1", "index", "controller1")
@dd.ActionLink("Action2", "index", "controller2")
}
注意扩展方法SetLinksActiveByControllerAndAction().这就是根据当前控制器/操作使链接处于活动状态的原因.
免责声明:我是TwitterBootstrapMVC的作者.
如果使用Bootstrap 3,则需要购买许可证.对于Bootstrap 2,它是免费的.
标签:razor,twitter-bootstrap,asp-net-mvc-routing,c,asp-net-mvc 来源: https://codeday.me/bug/20191030/1966130.html