在mvc中使用bootstrap单击子选项卡时无法激活父选项卡

时间:2014-09-03 12:02:18

标签: asp.net-mvc-4

我正在使用bootstrap选项卡,这是我的母版页:

    <div class="navbar-collapse collapse">
                    <ul class="nav navbar-nav pull-right">
                 <li class="dropdown">
              <a href="#" class="dropdown-toggle" data-toggle="dropdown">Users <b class="caret"></b></a>//this is my 1st tab
                            <ul class="dropdown-menu">
                                <li class="divider"></li>
                                <li><a href="">Staff</a>//this is my child tab
                                <li><a href="">Clients</a>//this is my child tab
                                <li class="divider"></li>
                            </ul>
                        </li>

 @Html.MenuItem("Categories", "categories", "Admin")//this is my second tab.

这是我的html助手:

public static class MenuExtensions
    {
        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("active");
            }
            li.InnerHtml = htmlHelper.ActionLink(text, action, controller).ToHtmlString();
            return MvcHtmlString.Create(li.ToString());
        }
    }



<a href="#" class="dropdown-toggle" data-toggle="dropdown">Users <b class="caret"></b></a>

现在上面的行如何在下面的行中指定 classname data-toggle 属性:

@Html.MenuItem("Staff", "staff", "Admin")

谁能告诉我?

1 个答案:

答案 0 :(得分:1)

请接受MenuItem帮助方法中的cssClass和DataToggle参数。 像:

        public static MvcHtmlString MenuItem(
            this HtmlHelper htmlHelper,
            string text,
            string action,
            string controller,
            string dataTogVal,
            string cssClass
        )

接下来,调用ActionLink方法的5参数重载,并传递dataTogVal和cssClass。喜欢:

 li.InnerHtml = htmlHelper.ActionLink(text, action, controller, null, new { @class = cssClass, data_toggle = dataTogVal }).ToHtmlString();