提交表单后如何保持复选框与之前选中状态一致？

要实现提交表单后复选框保留选中状态，推荐使用ViewModel绑定的方式，比零散的ViewBag更易维护，步骤如下：

1. 创建筛选ViewModel #

在项目中添加一个ViewModel类，统一接收和传递筛选参数：

public class StudentFilterViewModel
{
    // 存储选中的课程（数组形式接收多个复选框值）
    public List<string> SelectedCourses { get; set; } = new List<string>();
    // 存储选中的性别
    public List<string> SelectedGenders { get; set; } = new List<string>();
    // 排序选项
    public bool SortByAz { get; set; }
    public bool SortByZa { get; set; }

    // 可选：预定义可选选项，避免View中硬编码
    public List<string> AvailableCourses { get; } = new List<string> { "Java", "C++", "Python" };
    public List<string> AvailableGenders { get; } = new List<string> { "Male", "Female" };
}

2. 修改Controller方法 #

更新FilterStu方法，接收ViewModel参数，并将其传回View（这样筛选状态会被保留）：

[HttpGet]
public IActionResult FilterStu(StudentFilterViewModel filterModel)
{
    // 这里编写你的学生筛选逻辑，比如根据filterModel查询数据库
    // 示例：var students = _context.Students.Where(...).ToList();

    // 将筛选模型传递回View，用于恢复复选框选中状态
    return View(filterModel);
}

3. 更新View中的表单代码 #

修改HTML表单，将复选框的name与ViewModel属性对应，并根据Model值设置checked状态：

@model StudentFilterViewModel

<form asp-controller="Student" asp-action="FilterStu" method="get">
    <div class="dropdown">
        <div class="selectBox" onclick="showCheckboxes()">
            <select class="btn btn-outline-secondary">
                <option style="color:darkturquoise">Filter</option>
            </select>
            <div class="overSelect"></div>
        </div>
        <div id="checkboxes" class="dropdown-content">
            <ul>
                <label class="labelclass" style="color:cornflowerblue">
                    <u><i class="bi bi-book-half"></i>Courses</u>
                </label>
                <!-- 循环生成课程复选框（可选，比硬编码更灵活） -->
                @foreach (var course in Model.AvailableCourses)
                {
                    <li>
                        <input type="checkbox" name="SelectedCourses" value="@course" 
                            @(Model.SelectedCourses.Contains(course) ? "checked" : "") />
                        &nbsp;&nbsp;@course
                    </li>
                }

                <label style="color:cornflowerblue">
                    <i class="bi bi-people"></i> <u>Gender</u>
                </label>
                @foreach (var gender in Model.AvailableGenders)
                {
                    <li>
                        <input type="checkbox" name="SelectedGenders" value="@gender" 
                            @(Model.SelectedGenders.Contains(gender) ? "checked" : "") />
                        &nbsp;&nbsp;@gender
                    </li>
                }

                <label style="color:cornflowerblue">
                    <i class="bi bi-sort-alpha-down"></i><u>Sorting</u>
                </label>
                <li>
                    <!-- 使用ASP.NET Core Tag Helper自动绑定状态，更简洁 -->
                    <input asp-for="SortByAz" />
                    &nbsp;&nbsp;Sort by A-Z
                </li>
                <li>
                    <input asp-for="SortByZa" />
                    &nbsp;&nbsp;Sort by Z-A
                </li>

                <button class="btn btn-outline-success my-2 my-sm-0" type="submit">
                    <i class="bi bi-search"></i>&nbsp;&nbsp;
                </button>
                <!-- 改用a标签实现清空，避免提交筛选参数 -->
                <a class="btn btn-outline-warning" asp-action="Index" asp-controller="Student">
                    <i class="bi bi-house"></i>Clear
                </a>
            </ul>
        </div>
    </div>
</form>

关键说明 #

• 表单使用method="get"：筛选参数会显示在URL中，刷新页面或分享链接时状态不会丢失，和Stack Overflow筛选逻辑一致。
• 复选框name统一为数组形式：比如SelectedCourses，后端ViewModel的List<string>会自动接收多个选中值，避免原来searchString1/2/3的零散命名问题。
• 避免NullReferenceException：ViewModel中初始化空列表（new List<string>()），防止首次加载时SelectedCourses为null。
• 清空按钮改为<a>标签：原来的submit按钮会提交表单，改用跳转链接直接回到Index页面，彻底清空筛选状态。

内容的提问来源于stack exchange，提问作者Shrenik YD