标签：razor twitter-bootstrap asp-net-mvc-routing c asp-net-mvc

因此,我遇到了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

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。