如何在 ASP.NET MVC 中添加下拉列表

Question

public class Product
{
    [Key]
    public int Id { get; set; }
    [Required]
    public string Name { get; set; }
    public string SKU { get; set; }
    public string Description { get; set; }
    public decimal Price { get; set; }
    public bool Status { get; set; }
    public bool IsMenuItem { get; set; }
    public int Count { get; set; }
    public int? CategoryId { get; set; }
    public Category Category { get; set; }
}

---

public class Category
{
    [Key]
    public int Id { get; set; }
    public string Name { get; set; }
}

---

我想添加“CategoryId”下拉列表而不是<here> 标签

 @model OnlineShopArmenia.Models.Product

@{
    ViewData["Title"] = "Create";
}

<h1>Create</h1>

<h4>Product</h4>
<hr />
<div class="row">
    <div class="col-md-4">
        <form asp-action="Create">
            <div asp-validation-summary="ModelOnly" class="text-danger"></div>
            <div class="form-group">
                <label asp-for="Name" class="control-label"></label>
                <input asp-for="Name" class="form-control" />
                <span asp-validation-for="Name" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="SKU" class="control-label"></label>
                <input asp-for="SKU" class="form-control" />
                <span asp-validation-for="SKU" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Description" class="control-label"></label>
                <input asp-for="Description" class="form-control" />
                <span asp-validation-for="Description" class="text-danger"></span>
            </div>
            <div class="form-group">
                <label asp-for="Price" class="control-label"></label>
                <input asp-for="Price" class="form-control" />
                <span asp-validation-for="Price" class="text-danger"></span>
            </div>
            <div class="form-group form-check">
                <label class="form-check-label">
                    <input class="form-check-input" asp-for="Status" /> @Html.DisplayNameFor(model => model.Status)
                </label>
            </div>
            <div class="form-group form-check">
                <label class="form-check-label">
                    <input class="form-check-input" asp-for="IsMenuItem" /> @Html.DisplayNameFor(model => model.IsMenuItem)
                </label>
            </div>
            <div class="form-group">
                <label asp-for="Count" class="control-label"></label>
                <input asp-for="Count" class="form-control" />
                <span asp-validation-for="Count" class="text-danger"></span>
            </div>
                <here>
            <div class="form-group">
                <input type="submit" value="Create" class="btn btn-primary" />
            </div>
        </form>
    </div>
</div>

<div>
    <a asp-action="Index">Back to List</a>
</div>

@section Scripts {
    @{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}

Answer 1

您可以在控制器中使用此代码：

ViewBag.Categories = new SelectList(List of categories for show in view, "Id", "Name");

如果您的数据库中有类别，您可以查询获取类别列表，或者您可以使用 Id 和名称制作类别列表，然后将列表传递给 SelectList 的第一个参数。

在你的视野中：

 <div class="form-group">
      <label>Categories :</label>
      <select name="CategoryId" asp-for="CategoryId" class="formcontrol" asp-items="ViewBag.Categories">
          <option value="">Please choose user category:</option>
      </select>
      <span asp-validation-for="CategoryId" class="text-danger"></span>
 </div>

或通过标签助手生成：

@Html.DropDownListFor(model => Category ,ViewBag.Categories as SelectList,  new { @class = "form-group"} )