Bootstrap datepicker and bootstrap validator

When using BootstrapValidator with Bootstrap-datetimepicker or Bootstrap-datepicker, you should revalidate the date field.

So you should add this:

1) using with bootstrap-datetimepicker :

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

2) using with bootstrap-datepicker :

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

See the datetimepicker example for more information.


Somehow, after selecting a date, datepicker() loses focus of the date field and none of the validator plugins can see the date input field as filled (valid). As a conclusion, a simple .focus() does the trick.

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