Select2多选下拉列表重载后无法加载全部选中值

核心原因 #

ASP.NET MVC的DropDownListFor在多选模式下，会忽略SelectListItem的Selected属性，优先通过绑定的模型属性（此处为CourseTopicsApproved）匹配选中项。结合Select2使用时，若前端初始化逻辑未正确读取模型的选中集合，就会出现仅第一个值被选中的情况。

解决方案 #

1. 确认模型属性类型正确性 #

确保CourseTopicsApproved是可枚举集合类型（如IEnumerable<int>、List<int>），而非单个数值类型。你的代码中已使用IEnumerable<int>，只需保证控制器返回视图时，该属性确实包含所有选中的ID集合。

2. 移除冗余的Selected属性赋值（可选但推荐） #

既然DropDownListFor多选时不依赖SelectListItem.Selected，可从SetCourseTopics方法中移除该赋值，避免逻辑混淆：

courseTopics.Add(new SelectListItem()
{
    Text = topic.Topic,
    Value = topic.CourseTopicId.ToString(),
    Group = groups.FirstOrDefault(x => x.Name == topic.SubCategory.Topic)
    // 移除Selected属性赋值
});

MVC会自动根据CourseTopicsApproved的值匹配选中项。

3. 强制Select2读取模型选中值 #

页面重载时，即使原生select已正确生成选中项，Select2可能未正确识别。可在初始化Select2时，手动传入模型的选中集合并触发变更：

<script>
// 将模型的选中值序列化为JS数组
var selectedTopics = @Html.Raw(Json.Serialize(Model.CourseTopicsApproved));

$(".course-topics").select2({
    placeholder: 'Select Topic(s)',
    allowClear: true,
    multiple: true
})
// 手动设置选中值并触发change事件，确保Select2更新UI
.val(selectedTopics)
.trigger('change');
</script>

4. 验证原生select的渲染结果 #

页面重载后查看源代码，确认原生<select>元素中，所有应选中的<option>都带有selected="selected"属性。若只有第一个有该属性，说明模型的CourseTopicsApproved集合未正确传递到视图，需检查控制器中是否正确赋值该属性。

额外注意点 #

• 表单提交时CourseTopicsApproved的绑定已确认正常，无需额外调整。
• Select2 v4.0.13对多选的支持稳定，无需升级版本，重点优化初始化逻辑与模型绑定即可。

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