Playing with pickadate - BootstrapValidator

The following example demonstrates how to use BootstrapValidator with the pickadate plugin.

You should look at the basic principles when integrating BootstrapValidator with other plugins

<!-- Include pickadate -->
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.5.3/themes/default.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.5.3/themes/default.date.css">
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.5.3/themes/default.time.css">
<script src="//cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.5.3/picker.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.5.3/picker.date.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.5.3/picker.time.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/pickadate.js/3.5.3/legacy.js"></script>
<form id="pickDateForm" method="post" class="form-horizontal">
    <div class="form-group">
        <label class="col-sm-3 control-label">Date of birth</label>
        <div class="col-sm-5">
            <input type="text" class="form-control" name="dob" id="dob" />
        </div>
    </div>
    <div class="form-group">
        <div class="col-sm-5 col-sm-offset-3">
            <button type="submit" class="btn btn-default">Validate</button>
        </div>
    </div>
</form>

$(document).ready(function() {
    $('#dob').pickadate({
        format: 'mm/dd/yyyy',
        formatSubmit: 'mm/dd/yyyy',
        hiddenName: true
    });
    $('#dob')
        .pickadate('picker')
        .on('render', function() {
            // http://amsul.ca/pickadate.js/api.htm#events-callbacks
            // Revalidate the dob field
            $('#pickDateForm').bootstrapValidator('revalidateField', 'dob');
        });
    $('#pickDateForm').bootstrapValidator({
        feedbackIcons: {
            valid: 'glyphicon glyphicon-ok',
            invalid: 'glyphicon glyphicon-remove',
            validating: 'glyphicon glyphicon-refresh'
        },
        excluded: ':disabled',
        fields: {
            dob: {
                validators: {
                    notEmpty: {
                        message: 'The date of birth is required'
                    },
                    date: {
                        format: 'MM/DD/YYYY',
                        message: 'The date of birth is not a valid date'
                    }
                }
            }
        }
    });
});