MVC RadiobuttonFor Razor 如何使标签能够点击？

Question

我正在尝试用 razor 语法制作一个单选按钮列表，到目前为止我已经想出了这个

@foreach (var p in Model)
{
    <div id="projectList" class="col-lg-5">
        @Html.RadioButton("name", "1", false, new { onCLick = "ShowOption(this)", id = p.id.ToString() })
        @Html.Label(p.id.ToString(), p.name)
    </div>
}   

但标签不与单选按钮关联。

Answer 1

您的foreach循环不会for为标签生成属性（如果您new { id = p.id.ToString() }从RadioButton方法中删除，id则不会添加任何属性，尽管这是默认行为。

当您的模型添加属性时，不添加属性的原因是IEnumerable<T>为了遵守 HTML-4 标准，该标准规定：

ID 令牌必须以字母 ([A-Za-z]) 开头

HtmlHelpers根据属性生成id属性name，但用下划线替换 和[,]和.字符，以防止与选择器冲突jQuery（例如，属性.中的aid将被解释为类名选择器）。在您的情况下，name是name="[0].Name"集合中的第一项，但因为这意味着生成id="_0__Name"（在 HTML-4 中无效），所以HtmlHelper仅省略id( 在 a 的情况下label，for属性。

解决此问题的一个简单方法是将单选按钮包装在<label>元素中

<label>
    @Html.RadioButton("name", "1", false)
    <span>@p.name</span>
</label>

另一种选择是生成id属性RadioButton()并for在标签中生成匹配属性

@Html.RadioButton("name", "1", false, new { onclick = "ShowOption(this)", id = p.id })
@Html.Label(p.name, new { @for = p.id})

旁注：我建议您使用强类型RadioButtonFor()和LabelFor()方法。