复选框不适用于布尔视图模型属性

Question

我正在使用 MVC6 并且在我的表单中有一个复选框输入字段，但是当提交表单时，复选框的值总是作为 false 传递给 ViewModel：

这是在我的 ViewModel 中声明属性的方式：

[Display(Name = "Include Sales Tax")]
public bool IncludeSalesTax { get; set; }

这是我的 MVC6 razor 表单中的表单外观：

<div class="form-group">
    <div class="checkbox">
        <label><input asp-for="IncludeSalesTax" type="checkbox" value="">@Html.DisplayNameFor(m => m.IncludeSalesTax)</label>
    </div>
</div>

我认为上述方法是遵循 Twitter Bootstrap 标准并使用 ASP.NET MVC6 asp-for 标签进行模型绑定的最佳方式。

当我提交表单时，IncludeSalesTax 的值始终为 false，即使选中时也是如此。我做错了什么？

Answer 1

如果设置了输入类型复选框，则会发送一个“on”。否则不发送。 重要的是，您将 value 属性设置为 true。在这种情况下，它发送真或空，这非常适合绑定到布尔值。

<input type="checkbox" name="yourPropertyName" value="true" checked />

Answer 2

razor 视图引擎通常使用相同的名称创建一个复选框和一个隐藏输入。

您可以简单地使用下面的 html 来确保获得您想要的结果：

<div class="form-group">
        <div class="checkbox">     
    <input type="checkbox" value="true" name="IncludeSalesTax" />Include Sales Tax
    <input type="hidden" value="false" name="IncludeSalesTax" />
        </div>
    </div> 

Answer 3

如果复选框应默认为选中状态，Pinki 的上述回答很好。

如果复选框应默认为未选中，则在单击时，一些内嵌 javascript 会将该值设置为 true 或 false：

<input name="yourPropertyName" type="checkbox" value="false" onchange="this.value=this.checked">

Answer 4

在让 Visual Studio 根据我的 ViewModel 生成表单后，它是如何做到的：

        <div class="checkbox">
            <input asp-for="isTaxable" />
            <label asp-for="isTaxable"></label>
        </div>

此外，我错过了输入标签的关闭。所以它也可以这样做，这是引导首选的方式：

<label><input asp-for="isTaxable" type="checkbox" value=""/>@Html.DisplayNameFor(m => m.isTaxable)</label>