Date Range Picker和bootstrapValidator同时使用时，选择日期后无法正常触发校验

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/zero_295813128/article/details/52690095

在使用bootstrapValidator时，又同时使用了Date Range Picker，这时候就出现了，选择了日期后，bootstrapValidator不能正常通过校验。

如上图时间的选择会一直出现请选择时间。这时候我百度了一下解决方案还在有人也遇到过这样的情况，

当选择完日期后，校验结果并没有达到预期，是因为bootstrapValidator插件默认情况下，不会重复校验一个已经标记为验证通过或验证不通过的字段。so ，当开始触发校验后，没有通过校验，当正确选择日期后，并不会刷新校验结果，就会导致数据无法正常提交，当手动把日期改变后，会发现校验被正确触发了。现在就说解决方法。

所以需要在Date Range Picker隐藏的时候重新触发校验

$('#headlineAddForm #rangeTime').daterangepicker({
        timePicker : true, //是否显示小时和分钟
        timePicker24Hour: true,
        timePickerIncrement : 10, //时间的增量，单位为分钟
        format : 'YYYY-MM-DD HH:mm:ss', //控件中from和to 显示的日期格式
    }, function(start, end, label) {
        $("#headlineAddForm #startTime").val(start.format('X'));
        $("#headlineAddForm #endTime").val(end.format('X'));
    }).on('hide.daterangepicker', function() {
        $('#headlineAddForm').data('bootstrapValidator').updateStatus('rangeTime', 'NOT_VALIDATED',null).validateField('rangeTime');
    });

Date Range Picker有一个隐藏的事件叫做 hide.daterangepicker 当关闭Date Range Picker的时候回出发该时间的执行，这时候调用bootstrap的updateStatus清空校验信息，再次调用validateField对字段进行再次校验就可以了。

下面引用给出解决方案的那个童鞋的介绍

updateStatus方法的作用是更新给定字段的校验状态，官方介绍如下：

validateField方法的作用是触发给定字段的校验