Select标签选择选项后Unobtrusive Validation验证消息未消失问题求助

问题描述：使用Unobtrusive Validation做表单验证时，输入框输入内容后验证消息会自动消失，但<select>标签在选择选项后，验证消息仍然显示，即使已经选择了有效选项。

问题原因 #

你使用了Select2插件（通过data-control="select2"属性可判断），Select2会替换原生<select>元素为自定义UI组件，它的选择操作不会自动触发原生<select>的change事件。而Unobtrusive Validation依赖原生表单元素的事件（如change、keyup）实时更新验证状态，因此选择选项后验证逻辑未被触发，消息不会消失。

解决方案 #

在Select2的选择事件中手动触发原生<select>的change事件，或直接调用jQuery Validate的验证方法更新状态：

方法1：触发原生change事件 #

添加以下JavaScript代码：

// 监听所有带data-control="select2"的select元素的选择事件
$('select[data-control="select2"]').on('select2:select', function() {
    // 触发原生select的change事件，让Unobtrusive Validation感知到变化
    $(this).trigger('change');
});

方法2：直接调用验证方法 #

也可直接调用jQuery Validate的valid()方法触发当前元素的验证：

$('select[data-control="select2"]').on('select2:select', function() {
    // 直接验证当前select元素，更新验证状态
    $(this).valid();
});

额外检查 #

确保<select>选项的value属性正确绑定了BusinessTypeId的有效值，比如选项value为对应的整数ID，而非空值或无效值。

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