我正在使用 Tag Helpers 在 MVC 表单中添加一个复选框:
<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>
当用户将值从 Unchecked 更改为 Checked 时,传递回 Controller 的表单值为 True - 完美。
但是,如果复选框的值开始时为 Checked,而用户将其更改为 Unchecked,则传回 Controller 的表单值仍然为 True???
最佳答案
当类型为checkbox
时,输入标签助手会为您创建一个隐藏的复选框元素,该元素具有相同的名称
。如果查看页面的查看源代码,可以看到
<input name="Billable" type="hidden" value="false">
当用户启用/选中复选框并提交表单时,它将发送 2 个表单数据项,一个用于值为 True
的实际复选框,第二个用于值为 的隐藏输入>错误
。
如果你检查网络流量(Chrome devtools->network),你可以看到这个
Billable: true
Billable: false
当模型绑定(bind)器使用此数据时,它将优先考虑 True
值并将其映射到您的 bool 属性。
当用户取消选中复选框并提交表单时,它将仅发送一个表单数据元素,即值为 false
的隐藏输入元素,模型绑定(bind)器将设置为 false
操作方法参数的 bool 属性的值。
您当前的代码正在生成复选框元素和一个具有相同名称 Billable
的附加 隐藏输入元素。所以基本上它将呈现 2 个输入元素(1 个复选框,1 个助手创建的隐藏元素和 1 个您明确创建的元素)。当用户取消选中该复选框时,它将为您明确创建的复选框发送 True
,为标签助手创建的复选框发送 false
。
如果你检查网络流量(Chrome devtools->network),你可以看到这个
Billable: True
Billable: false
模型绑定(bind)器将使用此信息并将值 True
映射到 View 模型的 Billable 属性。
解决方案是删除额外的隐藏元素并依赖于由标签助手创建的元素。
<div class="form-group">
<label asp-for="@Model.Billable"></label>
<input asp-for="@Model.Billable" type="checkbox" />
</div>
关于asp.net-mvc - ASP.NET Core Tag Helper Checkbox 不保存未选中的值,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50513690/