Bootstrap datepicker和bootstrapvalidation器

我从这里使用bootstrap datepicker和从这里使用bootstrapvalidation器。 我也在使用bootstrap v3.1.1。

从datepicker中选择日期后，validation器不会做出反应。 它只在我使用键盘输入日期时工作。

这是我的HTML代码：

在.js文件中我添加了：

 $(document).ready(function () { $('.datepicker').datepicker(); )}; 

和validation人：

 $(document).ready(function () { $('#myForm').bootstrapValidator({ feedbackIcons: { valid: 'glyphicon glyphicon-ok', invalid: 'glyphicon glyphicon-remove', validating: 'glyphicon glyphicon-refresh' }, fields: { endDate: { validators: { date: { format: 'DD/MM/YYYY', message: 'The format is dd/mm/yyyy' }, notEmpty: { message: 'The field can not be empty' } } } } }); }); 

Answer 1

将BootstrapValidator与Bootstrap-datetimepicker或Bootstrap-datepicker一起使用时，应重新validation日期字段。

所以你应该添加这个：

1）使用bootstrap-datetimepicker：

 $('.date') .on('dp.change dp.show', function(e) { // Revalidate the date when user change it $('#myForm').bootstrapValidator('revalidateField', 'endDate'); }); 

2）使用bootstrap-datepicker：

 $('.datepicker') .on('changeDate show', function(e) { // Revalidate the date when user change it $('#myForm').bootstrapValidator('revalidateField', 'endDate'); }); 

有关更多信息，请参阅datetimepicker示例 。

Answer 2

不知何故，在选择日期后，datepicker（）失去了日期字段的焦点，并且没有任何validation器插件可以将日期输入字段视为已填充（有效）。 作为结论，一个简单的.focus（）可以解决问题。

 $('#datefield').datepicker({ //datepicker methods and settings here }).on('changeDate', function (e) { $(this).focus(); }); 

Answer 3

以上接受的答案对我不起作用。 对我有用的很简单。

 $('#datefield').datepicker().on('changeDate', function (e) { $('#datefield').focus(); $('#anyotherfield').focus(); $('#datefield').focus(); }); 

希望这可以帮助！

Answer 4

对于大多数情况，上面的答案应该有效，但如果最终任何答案对你不起作用，也可以尝试这样做：

 $('.datepicker').change(function () { $(this).focus(); $(this).blur(); }); 

此脚本中的主要思想是通过“设置”强制validation并在“取消设置”焦点之后强制validation。 我理解这类似于模拟允许运行validation的正常事件。

祝好运！