时间戳

首页 > 解决方案 > 无法将部分视图中的复选框绑定到主模型（MVC）

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

问题描述

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

我有一个模型：

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>

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

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

标签： asp.net-mvccheckboxpartial-viewsmodel-binding

解决方案

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

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

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

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

那么脚本应该是

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

推荐阅读