c# - ASP.NET 5 MVC 6 中的单选按钮标记帮助程序

Question

我在 ASP.NET 5 MVC 6 中没有看到任何单选按钮的标记帮助程序。处理需要使用单选按钮的表单元素的正确方法是什么？

Answer 1

有一个适用于所有输入类型的 TagHelper，其中也包括单选按钮类型。假设你有一个像这样的 View 模型

public class CreateUserVm
{
    public string UserName { set; get; }
    public IEnumerable<RoleVm> Roles { set; get; } 
    public int SelectedRole { set; get; }
}
public class RoleVm
{
    public int Id { set; get; }
    public string RoleName { set; get; }        
}

在您的 GET 操作中，

public IActionResult Index()
{
    var vm = new CreateUserVm
    {
        Roles = new List<RoleVm>
        {
            new RoleVm {Id = 1, RoleName = "Admin"},
            new RoleVm {Id = 2, RoleName = "Editor"},
            new RoleVm {Id = 3, RoleName = "Reader"}
        }
    };
    return View(vm);
}

在 View 中，您可以简单地使用输入标记的标记。

@model YourNamespaceHere.CreateUserVm
<form asp-action="Index" asp-controller="Home">
    <label class="label">User name</label>
    <div class="col-md-10">
        <input type="text" asp-for="UserName" />
    </div>
    <label class="label">Select a Role</label>
    <div class="col-md-10">
    @foreach (var item in Model.Roles)
    {
       <input asp-for="SelectedRole" type="radio" value="@item.Id" /> @item.RoleName
    }
    </div>
    <input type="submit" />
</form>

当您发布表单时，所选角色的 Rold ID 将位于 SelectedRole 属性中

请记住，上面的 razor 代码将为生成的每个输入生成具有相同 Id 属性值和 name 属性值的输入元素通过循环。在上面的示例中，它将生成 3 个输入元素(单选按钮类型)，并将 Id 和 name 属性值设置为 SelectedRole。模型绑定(bind)将在 name 属性值与 View 模型中的属性名称 (SelectedRole) 匹配时起作用，但重复的 Id 属性值可能会给您带来客户端代码的麻烦(文档中重复的 ID 无效)