我的MVC应用程序中的共享_layout.cshtm
文件(母版页)中有几个列表项。
类似的东西:
<ul>
<li>Home</li>
<li>about</li>
<li>contact</li>
<li>blog</li>
</ul>
当用户在主页中时,我希望归属li
项目具有类selected
,如下所示:
<li class="selected">Home</li>
等等。这样做的最佳方式是什么?
在常规的asp.net网站上,我曾经在母版页中有一个方法并从子页面调用该方法,但在MVC中我不知道该怎么做。
感谢。
答案 0 :(得分:11)
您可以编写自定义帮助程序方法:
public static MvcHtmlString MenuItem(
this HtmlHelper htmlHelper,
string text,
string action,
string controller
)
{
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) &&
string.Equals(currentController, controller, StringComparison.OrdinalIgnoreCase))
{
li.AddCssClass("selected");
}
li.SetInnerText(text);
return MvcHtmlString.Create(li.ToString());
}
然后:
<ul>
@Html.MenuItem("Home", "home", "home")
@Html.MenuItem("About", "about", "home")
@Html.MenuItem("Contact", "contact", "home")
@Html.MenuItem("Blog", "blog", "home")
</ul>
帮助程序检查当前操作和控制器,如果它们与作为参数传递给助手的那个匹配,它会将selected
CSS类附加到li
。
答案 1 :(得分:0)
只想分享我的所作所为:
我创建文件夹App_Code
并添加CustomHelpers.cshtml
。在其中我创建了这样的东西:
@helper MainMenu(string SelectedItem) {
<ul class="MainMenu">
<li><a href="/home" @if (SelectedItem == "Home") { <text>class="Active"</text> }>Home</a></li>
<li><a href="/about" @if (SelectedItem == "About") { <text>class="Active"</text> }>About</a></li>
<li><a href="/foo" @if (SelectedItem == "Foo") { <text>class="Active"</text> }>Foo</a></li>
</ul>
}
比我的MasterPage(_Layout.cshtml)中我添加了这个我希望我的菜单出现的地方:
@CustomHelpers.MainMenu(ViewBag.SelectedMenu)
而且在我看来,就像我改变我的页面标题一样,我改变了我选择的菜单:
@{
ViewBag.Title = "Welcome to my homepage";
ViewBag.SelectedMenu = "Home";
}
从本教程中了解了我的想法:www.asp.net/mvc/videos/mvc-3/mvc-3-razor-helpers