首页 > 解决方案 > 即使在 asp.net core razor 页面中选中,复选框列表也会返回 false

问题描述

学生考勤班

 public class StudentAttendance
{
    public int Id { get; set; }
    public int StudentID { get; set; }
    public bool IsPresent { get; set; }

}

查看我的出席表格的表格

 @foreach (var student in Model.Students)
          {
            <tr>
                <td> @student.FullName</td>
                <td><input type="hidden" asp-for="HiddenID" id="id" value="@student.StudentID"/></td>
                <td ><label class="col-form-label"><input type="checkbox" name="IsPresent" ></label></td> </tr> }

考勤页面模型

 [BindProperty]
    public StudentAttendance studentAttendance { get; set; }

    [BindProperty]
    public List<int> StudentAttendanceList { get; set; }

    [BindProperty(SupportsGet = true)]
    public int? SearchClassID { get; set; }


    [BindProperty]
    public List<int> HiddenID { get; set; }

    [BindProperty]
    public bool IsPresent { get; set; }


    public IEnumerable<Student> Students { get; set; }

出勤率()

foreach (var id in HiddenID)
        {
            Conn.StudentAttendance.Add(new StudentAttendance
            {
                StudentID = id,
                IsPresent = IsPresent,
            });
        }

当我提交并保存时,即使选中,IsPresent 值仍然为假

标签: asp.netasp.net-corerazorentity-framework-core

解决方案


由于表单中的 IsPresent 并没有绑定到 Model 上,而模型中 IsPresent 的默认值为 false。最后,每次都得到假。通过JavaScript函数动态改变checkbox中的值,可以将对应选中的id提交到后台。

在出勤.cshtml

<form method="post">
    <table>
        @foreach (var student in Model.Students)
        {
            <tr>
        
                <td> @student.FullName </td>
                <td><input type="hidden" asp-for="HiddenID" id="id" value="@student.StudentID" /></td>
                <td>
                    <label class="col-form-label">
                        <input type="checkbox" id="IsPresent" name="isPresent" value="false" onchange="changePresent(event,@student.StudentID)">
                    </label>
                </td>
            </tr>
        }
    </table>
    <input type="submit" name="name" value="sub" />
</form>
@section Scripts{ 
<script>
    function changePresent(e,id) {
        if (e.target.value=='true') {
            e.target.value = false
        }
        else {
            console.log('-=-=')
            e.target.value = id
        }
    }
</script>
}

然后,在 post 方法中,获取检查的 id,并证明该 id 是否被检查。

public void OnPost(int[] isPresent)
        {
            foreach (var id in HiddenID)
            {
                new StudentAttendance
                {
                    StudentID = id,
                    IsPresent = id == isPresent[id - 1],
                };
                /*Conn.StudentAttendance.Add(new StudentAttendance
                {
                    StudentID = id,
                    IsPresent = IsPresent,
                });*/
            }
        }

结果:

在此处输入图像描述


推荐阅读