提问人：bootsy 提问时间：8/1/2019 最后编辑：bootsy 更新时间：8/2/2019 访问量：101
MVC 视图中的下拉列表
Dropdown list in MVC view
问：
我正在尝试创建一个下拉列表，但除了“请选择一个”之外，我在下拉列表中没有得到任何内容，但没有值。
到目前为止，我已经尝试过这个：
视图：
<select asp-for="StatusToEdit.Color.Name" asp-items="Model.AvailableColors">
<option>Please select one</option>
</select>
型：
public SelectList AvailableColors { get; set; }
public void OnGet()
{
AvailableColors = new SelectList(nameof(StatusColor.ColorId),
nameof(StatusColor.Name));
}
模拟列表：
private static List<ItemStatus> _mockStatuses = new List<ItemStatus>
{
new ItemStatus { StatusId = 1, Name = "Complete", Color = new
StatusColor{ ColorId = 1, Name = "Auto" } },
new ItemStatus { StatusId = 2, Name = "Complete, Ongoing", Color =
new StatusColor{ ColorId = 2, Name = "Green" }},
new ItemStatus { StatusId = 3, Name = "In Process", Color = new
StatusColor{ ColorId = 3, Name = "Yellow" }}
};
我希望在下拉列表中看到要显示的所有颜色。
答：
1赞
Ryan
8/1/2019
#1
如果使用的是 asp.net 核心 MVC（Razor Pages 类似），则需要将模型属性类型修改为 或IEnumerable<SelectListItem> AvailableColorsList<SelectListItem> AvailableColors
1.型号
public class ManageStatusesEditViewModel
{
//other properties
public List<SelectListItem> AvailableColors { get; set; }
}
2.行动：
[HttpGet]
public IActionResult ManageStatusesEdit(int id)
{
//other logic
var dropdownData = new List<SelectListItem>();
_mockStatuses.ForEach(d => dropdownData.Add(new SelectListItem()
{
Value = d.Color.Name,
Text = d.Color.Name
}));
var editManageStatusesEditViewModel = new ManageStatusesEditViewModel
{
AvailableColors = dropdownData
};
return View(editManageStatusesEditViewModel);
}
3.查看：
<select asp-for="StatusToEdit.Color.Name" asp-items="Model.AvailableColors">
<option>Please select one</option>
</select>
4.结果：
0赞
Nick Mehrdad Babaki
8/2/2019
#2
您应该按如下方式创建列表：
ViewBag.ColorList = new SelectList(_mockStatuses.Select(d=> { return new SelectListItem { Text = d.Color.Name, Value = d.Color.ColorId.ToString() }; }),"Value","Text");
我使用了 ViewBag，但如果您愿意，您显然可以通过 ViewModel 将其传递给您的视图。
对于您的视图，您应该执行以下操作：
<select asp-items="@ViewBag.ColorList" asp-for="StatusToEdit.Color.Name" >
<option value="">Please select one</option>
</select>
请确保在创建 SelectList 时已在 SelectList 末尾添加了 Value 和 Text。
评论
You can create a SelectList from any collection but you need to specify the DataTextField and DataValueField values for the select tag helper to bind the options correctly