MVC 5-为所有页面添加导航下拉菜单

本文关键字：添加 导航 下拉菜单 MVC | 更新日期: 2023-09-27 18:25:53

几天前我刚开始学习MVC，我开始学习概念，但我在尝试在另一个页面上获得下拉菜单时有点吃力。我有一个类别列表，可以在categories''Index.chtml页面上创建一个下拉框。我有以下内容：

型号：

public class Category
{
    public int Id { get; set; }
    [Required]
    [StringLength(100, MinimumLength = 3)]
    public string Name { get; set; }
    [Required]
    public Boolean Visible { get; set; }
    public Category()
    {
        this.Visible = true;
    }
}

控制器：

private DefaultConnection db = new DefaultConnection();
    // GET: Categories
    public ActionResult Index()
    {          
        var CategoryLst = new List<string>();
        var CategoryQry = from c in db.Categories
                          orderby c.Name
                          where c.Visible == true
                          select c.Name;
        CategoryLst.AddRange(CategoryQry.Distinct());
        ViewBag.Categories1 = new SelectList(CategoryLst);
        return View(db.Categories.ToList());
    }

Index.chtml:

Category: @Html.DropDownList("Categories1", "All")

这正如预期的那样——我得到了一个很好的下拉框，里面有我唯一可见的类别。我知道这是有效的，因为用户导航到"Index"页面，该页面被路由到"Index（）"控制器，该控制器获取模型和数据，然后将其传递到页面以构建HTML。

我很难理解的是，我如何从应用程序的不同部分获得控制器/模型的数据？第一个问题，控制器与模型或视图的联系更紧密吗？

例如，如何将上面的下拉框放在Home''About.cshtml页面上？我可以将上面相同的代码从我的控制器放入我的HomeController中的"public ActionResult About（）"中，然后简单地将其放在About.cshtml页面上：

Category: @Html.DropDownList("Categories1", "All")

这是可行的，但我猜这不是正确的方法，因为重复代码。

我最终试图在导航栏中添加一个下拉菜单，其中包含"类别"列表，但我不知道该把代码放在哪里。一旦我能将类别名称/id列表添加到页面中，我就很擅长格式化。

谢谢，

MVC 5-为所有页面添加导航下拉菜单

我的建议是将导航添加到项目下共享文件夹中的_Layout.cshtml页面中，这样它在整个应用程序中都是通用的。

这里有一个关于这个主题的好教程~~https://stackoverflow.com/a/3832771/5590934

这里还有一个不错的MVC4示例：http://mvc4ajaxdropdownlist.codeplex.com/

谢谢大家，我想我已经掌握了MVC的窍门。你的帖子让我找到了这个解决方案，所以为其他人发布它。

我把这个添加到我的分类控制器：

[ChildActionOnly]
[AllowAnonymous]
public ActionResult Menu(string dropdownMenuTitle)
{
    ViewBag.DropdownMenuTitle = dropdownMenuTitle;
    var categoriesQuery = from d in db.Categories
                          orderby d.Name
                          where d.Visible == true
                          select d;
    return PartialView(categoriesQuery);
}

然后我在我的分类视图中创建了Menu.chtml，如下所示：

@model IEnumerable<App.Models.Category>
<li class="dropdown">
    <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">@ViewBag.DropdownMenuTitle <span class="caret"></span></a>
    <ul class="dropdown-menu">
        @foreach (var item in Model)
        {
            <li>@Html.ActionLink(item.Name, item.Name, "Items")</li>
        }
        <li role="separator" class="divider"></li>
        <li>@Html.ActionLink("All", "Feed", "Items")</li>
    </ul>
</li>

最后，我把它添加到"_Layout.cs.html"中，这样新菜单就会显示在所有页面上：

<ul class="nav navbar-nav">
    @Html.Action("Menu", "Categories", new { DropdownMenuTitle = "Categories" })
    ...
相关文章：