ASP.net MVC Razor - 将复选框绑定到布尔值答案

【问题标题】：ASP.net MVC Razor - binding checkboxs to bool valuesASP.net MVC Razor - 将复选框绑定到布尔值
【发布时间】：2017-04-21 18:07:53
【问题描述】：

我不知道如何让选中的复选框变为“真”，而未选中的复选框变为“假”布尔值。这是我正在处理的代码示例。

注意：我的 put 函数得到 200 响应，但复选框没有更新布尔值。

型号

public class AccountFeatures
        { public bool? FormCopy { get; set; }
            public bool? FormRename { get; set; }
            public bool? FormTransfer { get; set; }
            public bool? FormDelete { get; set; }
            public bool? FormEdit { get; set; }
            public bool? FormComplete { get; set; }
        }

查看

`$('.ui.form.accountfeatures').form({
            on: 'blur',
            inline: true,
            onSuccess: function () {
                $('#features').dimmer('show');
                $.ajax({
                    method: 'PUT',
                    data: { FormRename: $("#FormRename").val() ? true : false,
                        FormTransfer: $("#FormTransfer").val() ? true : false,
                        FormDelete: $("#FormDelete").val() ? true : false,
                        FormEdit: $("#FormEdit").val() ? true : false,
                        FormComplete: $("#FormComplete").val() ? true : false}

HTML

<tr>
                    <td>Form Copy</td>
                    <td class="center aligned">
                        <input type="checkbox" name="FormCopy" id="FormCopy" value="False" checked="@Model.Account.Features.FormCopy">
                    </td>
                </tr>
                <tr>
                    <td>Form Rename</td>
                    <td class="center aligned">
                        <input type="checkbox" name="FormRename" id="FormRename" value="FormRename" checked="@Model.Account.Features.FormRename">
                    </td>
                </tr>
                <tr>
                    <td>Form Transfer</td>
                    <td class="center aligned">
                        <input type="checkbox" name="FormTransfer" id="FormTransfer" value="FormTransfer" checked="@Model.Account.Features.FormTransfer">
                    </td>
                </tr>
                <tr>
                    <td>Form Delete</td>
                    <td class="center aligned">
                        <input type="checkbox" name="FormDelete" id="FormDelete" value="FormDelete" checked="@Model.Account.Features.FormDelete">
                    </td>
                </tr>
                <tr>
                    <td>Form Edit</td>
                    <td class="center aligned">
                        <input type="checkbox" name="FormEdit" id="FormEdit" value="FormEdit" checked="@Model.Account.Features.FormEdit">
                    </td>
                </tr>
                <tr>
                    <td>Form Complete</td>
                    <td class="center aligned">
                        <input type="checkbox" name="FormComplete" id="FormComplete" value="FormComplete" checked="@Model.Account.Features.FormComplete">
                    </td>
                </tr>

【问题讨论】：

您的手动 html 正在为每个复选框设置选中的属性（checked 属性的存在意味着它已选中）并且您的 value 属性与 bool 无关（@987654327 @ 只能绑定到true 或false，而不是string) - 使用强类型HtmlHelper 方法来生成你的html

标签： asp.net asp.net-mvc asp.net-mvc-4 razor boolean

【解决方案1】：

我通常使用EditorFor，它就可以工作：

@Html.EditorFor(m => m.CheckBoxProperty)

不过，我通常也只使用bool，而不是bool? 作为我的复选框属性。

关于checked 属性的注意事项 - 您通常只使用属性名称，如下所示：

<input type="checkbox" name="FormComplete" id="FormComplete" value="FormComplete" checked />

或者你使用checked="checked"，如：

<input type="checkbox" name="FormComplete" id="FormComplete" value="FormComplete" checked="checked" />

任何其他方式，例如使用checked="true" 或checked="false" 都不会产生您期望的结果，或者至少在所有浏览器中都不一致。无论您是否想要，这些用例通常会导致复选框。这是一个快速的模型来演示：

<input type="checkbox" value="test" name="test1" /> Test 1<br />
<input type="checkbox" value="test" name="test2" checked /> Test 2<br />
<input type="checkbox" value="test" name="test3" checked="checked" /> Test 3<br />
<input type="checkbox" value="test" name="test4" checked="true" /> Test 4<br />
<input type="checkbox" value="test" name="test5" checked="false" /> Test 5

以及Chrome 57下的输出截图：

本质上，您希望使用逻辑来确定是否完全插入 checked 属性，而不是插入它并让逻辑将其设置为 true 或 false。

【讨论】：