Asp.net Core MVC 6中Bootstrap模态框bool?下拉框值不保留问题

核心原因分析 #

bool?（Nullable）的取值为true/false/null，但HTML下拉框的选项值是字符串类型，若后端生成的下拉列表值与前端拿到的数值类型不匹配，或者分部视图模型绑定未正确处理，就会出现选中失效的情况。

具体解决步骤 #

1. 确保后端下拉列表值与类型匹配

在控制器中生成IsActive对应的下拉列表时，明确指定选项的Value为字符串类型，与bool?的三种状态一一对应：

// Index控制器或分部视图对应的控制器方法中
ViewBag.IsActiveList = new SelectList(new List<SelectListItem>
{
    new SelectListItem { Text = "请选择", Value = "" }, // 对应null
    new SelectListItem { Text = "激活", Value = "True" }, // 对应true
    new SelectListItem { Text = "未激活", Value = "False" } // 对应false
}, "Value", "Text");

在分部视图中使用强类型绑定生成下拉框，让框架自动处理选中逻辑：

@model YourNamespace.YourModel
@Html.DropDownListFor(m => m.IsActive, ViewBag.IsActiveList as SelectList, new { @class = "form-control", id = "IsActive" })

2. 若使用AJAX手动赋值，处理类型转换

如果是通过AJAX获取数据后手动给下拉框赋值，需将JavaScript中的布尔值/null转换为匹配下拉框选项的字符串：

// 假设AJAX返回的数据为data，其中包含isActive字段
const isActiveVal = data.isActive;
let selectVal = "";

if (isActiveVal === true) {
    selectVal = "True";
} else if (isActiveVal === false) {
    selectVal = "False";
}

// 选中对应选项
document.getElementById("IsActive").value = selectVal;
// 或用jQuery：$("#IsActive").val(selectVal);

注意：JavaScript的布尔值是小写的true/false，而下拉框选项的Value是大写的"True"/"False"，必须严格匹配。

3. 检查分部视图的模型传递

如果是通过AJAX请求加载分部视图，确保控制器返回PartialView时传入了正确的模型，且重新赋值了ViewBag的下拉列表：

public IActionResult GetEditPartial(int id)
{
    var model = _yourRepository.GetById(id);
    // 必须重新赋值ViewBag，因为分部视图无法直接复用主视图的ViewBag
    ViewBag.IsActiveList = new SelectList(/* 同上述下拉列表定义 */);
    return PartialView("_EditPartial", model);
}

这样强类型绑定的下拉框会自动根据模型的IsActive值选中对应选项，无需手动JS干预。

4. 验证HTML选项值

打开浏览器开发者工具，查看下拉框的HTML结构，确认<option>的value属性确实是""、"True"、"False"，避免后端生成时使用了小写"true"/"false"或数字"1"/"0"导致匹配失败。

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