MVC 将脚手架字段更新为下拉列表

Question

这里是 Web 开发新手。我目前正在使用 VS2019 并创建了一个 MVC 应用程序来为内部用户提供 CRUD 功能 (SQL)。我们有一个 CostCentre 字段，它应该是一个下拉列表而不是文本输入。

如何更改代码以显示下拉菜单而不是文本输入？

这是我的控制器中包含的内容：

[HttpPost]
[ValidateAntiForgeryToken]
public ActionResult Edit([Bind(Include = "Magic,EmployeeCode,UserName,Entity,AD_SAM,MSTelNum,CostCentre,SysUser_AD,Sys_User_K8")] EmpCosDim empCosDim)
{
    if (ModelState.IsValid)
    {
        db.Entry(empCosDim).State = EntityState.Modified;
        db.SaveChanges();
        return RedirectToAction("Index");
    }
    return View(empCosDim);
}

我找对地方了吗？

更新编辑视图 cshtml:

@model EmployeeBilling.EmpCosDim
@{
    ViewBag.Title = "Edit";
}

<h2>Edit</h2>

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()
    
    <div class="form-horizontal">
        <h4>EmpCosDim</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        @Html.HiddenFor(model => model.Magic)

        <div class="form-group">
            @Html.LabelFor(model => model.EmployeeCode, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.EmployeeCode, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.EmployeeCode, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.UserName, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.UserName, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.UserName, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Entity, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Entity, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Entity, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.AD_SAM, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.AD_SAM, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.AD_SAM, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.MSTelNum, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.MSTelNum, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.MSTelNum, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.CostCentre, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.CostCentre, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.CostCentre, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.SysUser_AD, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.SysUser_AD, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.SysUser_AD, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Sys_User_K8, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Sys_User_K8, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Sys_User_K8, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Save" class="btn btn-default" />
            </div>
        </div>
    </div>
}

<div>
    @Html.ActionLink("Back to List", "Index")
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

更新根据您发送的 link 添加外键，但仍然不显示下拉列表。我在这里做了更改：

// EmpCosDim.cs :

namespace EmployeeBilling
{
    using System;
    using System.Collections.Generic;
    using System.ComponentModel.DataAnnotations;
    using System.ComponentModel.DataAnnotations.Schema;

    public class EmpCosDim
    {
        public int Magic { get; set; }
        public string EmployeeCode { get; set; }
        public string UserName { get; set; }
        public string Entity { get; set; }
        public string AD_SAM { get; set; }
        public string MSTelNum { get; set; }

        [ForeignKey("ContainingCostCentre")]
        public string CostCentre { get; set; }
        public virtual EmpCosDim ContainingCostCentre { get; set; }

        public string SysUser_AD { get; set; }
        public string Sys_User_K8 { get; set; }
    }
}

更新所以我尝试将 CostCentre 更新为我的 EmpCosDim.cs 文件中的列表：

public class EmpCosDim
{
    [Key]
    public int Magic { get; set; }
    public string EmployeeCode { get; set; }
    public string UserName { get; set; }
    public string Entity { get; set; }
    public string AD_SAM { get; set; }
    public string MSTelNum { get; set; }

    public List<SelectCostCentreItem> CostCentre { get; set; }

    public string SysUser_AD { get; set; }
    public string Sys_User_K8 { get; set; }
}

public class SelectCostCentreItem
{
    public string CostCentre { get; set; }
}

但我的控制器出现错误 EmpCosDimsController.cs:

public ActionResult Index()
{
    return View(db.EmpCosDims.ToList());
}

这好像是因为我替换了：

public string CostCentre { get; set; }

和

public List<SelectCostCentreItem> CostCentre { get; set; }

如何更新我的控制器以查看列表并显示在下拉列表中？

Answer 1

在您的编辑屏幕中的 CostCentre 下拉列表实际上将显示您想要 selected 的所有 CostCentre 的列表。该列表在 EmpCosDim 模型和视图中不容易获得。您需要构建一个 select 列表并传递给您的视图并在视图中进行更改以获取该列表并显示为下拉列表。按照这些步骤 -

在编辑操作中（对于获取而不是 post 操作）像这样填充视图包

ViewBag.CostCentre = new SelectList([db.Concetres], ["Name"], ["Name"], 
[empCosDim.CostCentre]);

在这里你必须用你合适的 variable/method 替换括号中的项目。为了 select 列表构造函数第一个是所有成本中心的 source/list，第二个是要保存为值的 EmpCosDim 的字段名称 get selected，第三个要显示在 EmpCosDim 的字段下拉列表，最后一个是您要默认设置的值 select。

在编辑视图中替换以下代码

<div class="form-group">
    @Html.LabelFor(model => model.CostCentre, htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.EditorFor(model => model.CostCentre, new { htmlAttributes = new { @class = "form-control" } })
        @Html.ValidationMessageFor(model => model.CostCentre, "", new { @class = "text-danger" })
    </div>
</div>

与下一个代码块

<div class="form-group">
        @Html.LabelFor(model => model.CostCentre, htmlAttributes: new { @class = "control-label col-md-2" })
        <div class="col-md-10">
            @Html.DropDownList("CostCentre", (IEnumerable<SelectListItem>)ViewBag.CostCentre, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.CostCentre, "", new { @class = "text-danger" })
        </div>
 </div>

MVC 将脚手架字段更新为下拉列表

MVC Update Scaffolding field to dropdown

asp.net-mvc

scaffolding

dropdown

visual-studio-2019