无法将部分视图中的复选框绑定到主模型（MVC）

Question

我一直在遇到问题，我一直在寻找答案，但没有任何帮助。

我有一个模型：

public class Filters
{
    public bool Filter1 { get; set; }
    public bool Filter2 { get; set; }
    public bool Filter3 { get; set; }
    etc...
}

我有一个带有多个复选框的部分视图并尝试了多种方法：

<input id="Filter1" name="Filter1" type="checkbox" value="true">
<input type="hidden" value="false" name="Filter1" />

和

@Html.CheckBoxFor(model => model.Filter1)

然后我有一个主模型：

public class Dashboard
{
    ...
    public Filters FiltersDashboard { get; set; }
}

我在主视图的某处插入部分视图，如下所示：

@Html.EditorFor(model => model.FiltersDashboard, "Filters")

在 jquery 中，当单击复选框并显示复选框的值时，我会执行警报。该值保持不变。

<script>
    $("#Filter1").click(function () {
        alert(" @Model.FiltersDashboard.Filter1 ")
    });
</script>

编辑：也在 .submit 函数中尝试过，但模型值保持不变：

<script>
    $("#searchform").submit(function (event) {
        alert(" @Model.FiltersDashboard.Filter1 ")
        event.preventDefault();
    });
</script>

这告诉我有些东西没有正确绑定，但我不知道我做错了什么。

另外，我不使用复选框列表的原因是我需要为每个过滤器执行不同的查询，因此我需要它们的特定名称和绑定。

Answer 1

@Model.FiltersDashboard.Filter1 是剃须刀代码，在发送到视图之前在服务器上执行，所以它只会返回属性的初始值（如果你检查源代码，你会看到初始值已经硬编码在您的脚本中）。

但是，如果您的脚本正在执行，则意味着您在第二个代码 sn-p 中使用了手动 <input> 标签，在这种情况下，您的视图没有绑定到您的模型，因为正确的 name属性为name="FiltersDashboard.Filter1"，关联的id 属性为id="FiltersDashboard_Filter1"。

始终使用强类型 @Html.CheckBoxFor()，它将为 2 向模型绑定和客户端验证生成正确的 html。

还要注意，它只需要是@Html.EditorFor(model => model.FiltersDashboard) - 第二个参数是不必要的。

那么脚本应该是

<script>
    $('#FiltersDashboard_Filter1').click(function () {
        var isChecked = $(this).is(':checked');
        alert(isChecked);
    });
</script>