@Html.LabelFor“for”属性未正确分配 - <label for=FORM_ELEMENT>

Question

我正在使用 ASP.NET MVC v5.2.3。我在 Edge 调试器工具中收到警告：

错误使用

标签的 for 属性与任何元素 id 都不匹配。这可能会导致浏览器无法正确自动填写表单，并且辅助功能工具也无法正常工作。

要解决此问题，请确保标签的 for 属性引用表单字段的正确 ID。它提供了以下参考：https://developer.mozilla.org/en-US/docs/Web/HTML/Element/label

听起来我的标签的

For

属性应该填充与该标签关联的表单元素的 ID，但我不确定如何在以下代码中完成此操作。

这是我的简化模型：

public class Index
{
    [DisplayName("Coverage Year")]
    public int CoverageYear { get; set; }

    public List<SelectListItem> CoverageYears { get; set; } = new List<SelectListItem>();
}

简化视图：

<div class="form-group">
    @Html.LabelFor(model => model.CoverageYear, htmlAttributes: new { @class = "control-label col-md-2" })
    <div class="col-md-10">
        @Html.DropDownListFor(model => model.CoverageYear, Model.CoverageYears, new { id = "ddlCoverageYear", @class = "form-control" })
    </div>
</div>

这是它生成的 HTML：

<div id="initiateModalCoverageYearDiv" class="form-group">
    <label class="control-label col-md-3" for="SelectedYearValue">Coverage Year</label>
    <div class="col-md-9">
        <select id="initiateModalVendorId_ddlCoverageYear" class="form-control" name="SelectedYearValue">
            <option value="2024">2024</option>
            <option selected="selected" value="2023">2023</option>
        </select>
    </div>
</div>

如何修改视图以生成以下内容，以便使用下拉列表的 ID 更新属性，

initiateModalVendorId_ddlCoverageYear

？

<label class="control-label col-md-3" 
       for="initiateModalVendorId_ddlCoverageYear">Coverage Year</label>

Answer 1

这样做了。

@Html.LabelFor(model => model.SelectedYearValue, htmlAttributes: new { @class = "control-label col-md-2", @for = "initiateModalVendorId_ddlCoverageYear" })