Бритва: если модель - это список <>, то @Html.LabelFor создает пустое поле "для"

Если модель представляет собой список объектов, то @Html.LabelFor model => model[i].member) создает пустой атрибут for. DisplayName работает правильно, привязка к модели также отлично работает. Единственное, что не работает, это атрибут for.

Ниже приведены две версии кода MVC. Первые 3 фрагмента кода предназначены для комбинации модели, контроллера и представления, которая не работает (модель представляет собой список). Второй набор из 3 фрагментов кода работает. На этот раз список завернут в объект.

Что мне не хватает?

Модель:

public class ViewModel {
    public bool ClickMe { get; set; }
}

Контроллер:

public ActionResult LabelForViewModel() {
    List<ViewModel> model = new List<ViewModel>() {
        new ViewModel() { ClickMe = true}
    };
    return View(model);
}

Вид:

@model List<ModelBinding.Models.ViewModel>
// form code removed for brevity
@for (var i = 0; i < Model.Count; i++) {
    <div class="form-group">
        @Html.LabelFor(model => model[i].ClickMe)
        <div class="col-md-10">
            @Html.EditorFor(model => model[i].ClickMe, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model[i].ClickMe, "", new { @class = "text-danger" })
        </div>
    </div>
}

Разметка:

<div class="form-group">
    <label for="">ClickMe</label>
    <div class="col-md-10">
        <input name="[0].ClickMe" class="form-control check-box" type="checkbox" checked="checked" value="true" data-val-required="The ClickMe field is required." data-val="true"><input name="[0].ClickMe" type="hidden" value="false">
        <span class="field-validation-valid text-danger" data-valmsg-replace="true" data-valmsg-for="[0].ClickMe"></span>
    </div>
</div>

Обратите внимание, что поле for пусто и вход не имеет поля id (это поле используется в поле "для" ).

Я создал модель обертки, которая содержит список объектов, модифицировала контроллер и представление, а затем она работает нормально. В этом случае поле "for" заполняется правильно, и все работает так, как ожидалось.

public class ListWrapper {
    public List<ViewModel> ViewModels { get; set; }
}

Вид:

@for (var i = 0; i < Model.ViewModels.Count; i++) {
    <div class="form-group">
        @Html.LabelFor(model => model.ViewModels[i].ClickMe)
        <div class="col-md-10">
            @Html.EditorFor(model => model.ViewModels[i].ClickMe, new { htmlAttributes = new { @class = "form-control" } })
            @Html.ValidationMessageFor(model => model.ViewModels[i].ClickMe, "", new { @class = "text-danger" })
        </div>
    </div>
}

Разметка:

<div class="form-group">
    <label for="ViewModels_0__ClickMe">ClickMe</label>
    <div class="col-md-10">
        <input name="ViewModels[0].ClickMe" class="form-control check-box" id="ViewModels_0__ClickMe" type="checkbox" checked="checked" value="true" data-val-required="The ClickMe field is required." data-val="true"><input name="ViewModels[0].ClickMe" type="hidden" value="false">
        <span class="field-validation-valid text-danger" data-valmsg-replace="true" data-valmsg-for="ViewModels[0].ClickMe"></span>
    </div>
</div>

Итак, кажется, что атрибут for пуст, только если модель представляет собой список объектов.

Это известная проблема? Или, может быть, я что-то упустил?

Ответы

Ответ 1

Это поведение является результатом структуры, соответствующей спецификациям HTML-4. В HTML-4

Идентификаторы ID и NAME должны начинаться с буквы ([A-Za-z]), за которой может следовать любое количество букв, цифр ([0-9]), дефис ( "-" ), подчеркивание ( "_" ), двоеточие ( ":" ) и периоды ( "." ).

Когда ваша модель представляет собой коллекцию, и вы используете @Html.EditorFor(m => m[i].SomeProperty) для создания элементов управления формой, метод генерирует атрибуты name и id, основанные на имени свойства. В этом случае атрибут name для первого элемента в коллекции будет

name="[0].SomeProperty"

но чтобы избежать столкновений с селекторами jQuery, метод заменяет символы ., [ и ] символом подчеркивания _ при создании атрибута id, который приведет к

id="_0__SomeProperty"

но поскольку это недопустимо в соответствии со спецификацией HTML-4, хелпер не выводит его в html.

То же самое происходит при использовании @Html.LabelFor() (так как связанный элемент управления формы не имеет атрибута id, значение атрибута for не выводится в html.

Обратите внимание, что в HTML-5 атрибут id будет действителен, поэтому, надеюсь, это поведение будет удалено в будущем.

Второй пример работает, потому что id="ViewModels_0__ClickMe "начинается с буквы и поэтому является допустимым.

Боковое примечание. Вы можете решить первую проблему, создав собственные атрибуты id, например

@Html.LabelFor(model => model[i].ClickMe, new { for = string.Format("item{0}", i) })
@Html.EditorFor(model => model.ViewModels[i].ClickMe, new { htmlAttributes = new { @class = "form-control", id = string.Format("item{0}", i) } })

Ответ 2

Объявление @model присваивает объект модели переменной Model (обратите внимание на "M" ). Но тогда вы читаете от Model, который не был назначен.

Попробуйте следующее:

  @model List<ModelBinding.Models.ViewModel>
  // form code removed for brevity
        @for (var i = 0; i < Model.Count; i++) {
            <div class="form-group">
                @Html.LabelFor(model => Model[i].ClickMe)
                <div class="col-md-10">
                    @Html.EditorFor(model => Model[i].ClickMe, new { htmlAttributes = new { @class = "form-control" } })
                    @Html.ValidationMessageFor(model => Model[i].ClickMe, "", new { @class = "text-danger" })
                </div>
            </div>
        }

Это не объясняет, почему ваш второй пример работает вообще, но эй, попробуйте.