Флажок ASP.NET Core Tag Helper не сохраняет непроверенное значение

Question

Я добавляю флажок в форме MVC с помощью Tag Helpers:

<div class="form-group">
    <label asp-for="@Model.Billable"></label>
    <input asp-for="@Model.Billable" type="checkbox" />
    <input asp-for="@Model.Billable" type="hidden" />
</div>

Когда пользователь изменяет значение на Проверено с Не проверено, значение формы, возвращаемое обратно в контроллер, является Истинно - идеальным.

Тем не менее, если значение флажка начинается как "Проверено", а пользователь изменяет его на "Не проверено", значение формы, переданное обратно в контроллер, по-прежнему равно True???

Answer 1

Когда тип checkbox, вспомогательный тег ввода создает скрытый элемент для флажка для вас с тем же name, Если вы проверите источник просмотра страницы, вы можете увидеть, что

<input name="Billable" type="hidden" value="false">

Когда пользователь включает / проверяет флажок и отправляет форму, он отправит 2 элемента данных формы, один для фактического флажка со значением True а второй для скрытого ввода со значением False,

Если вы проверите сетевой трафик (Chrome devtools->network), вы можете увидеть это

Billable: true
Billable: false

Когда связыватель модели использует эти данные, он будет иметь приоритет над True значение и сопоставьте это с вашим логическим свойством.

Когда пользователь снимает флажок и отправляет форму, он отправит только один элемент данных формы, только один для скрытого элемента ввода со значением false и модель переплет установит false значение для вашего логического свойства вашего параметра метода действия.

Ваш текущий код генерирует элемент checkbox и дополнительный скрытый элемент ввода с тем же именем Billable, Таким образом, в основном он будет отображать 2 элемента ввода (1 флажок,1 скрытый элемент, который создал помощник, и 1, который вы явно создали). Когда пользователь снимает флажок, он будет отправлять True для вашего явно созданного и false для созданного помощником по тегам.

Если вы проверите сетевой трафик (Chrome devtools->network), вы можете увидеть это

Billable: True
Billable: false

Модель Binder будет использовать эту информацию и отобразить значение True в ваше свойство Billable вашей модели представления.

Решение состоит в том, чтобы удалить лишний скрытый элемент и положиться на тот, который создан тегом helper.

<div class="form-group">
    <label asp-for="@Model.Billable"></label>
    <input asp-for="@Model.Billable" type="checkbox" />
</div>