Bootstrap datepicker et bootstrap validator

J'utilise le bootstrap datepicker à partir d' ici et le validateur bootstrap à partir d' ici . J'utilise également bootstrap v3.1.1.

Après avoir sélectionné une date de datepicker, le validateur ne réagit pas. Il fonctionne juste lorsque j'utilise le clavier pour entrer une date.

Voici mon code HTML:

<form id="myForm" method="POST"> <div class="col-lg-3"> <div class="form-group"> <input name="endDate" type="text" class="datepicker form-control"> </div> </div> </form> 

Dans le fichier .js, j'ai ajouté:

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

Et pour les validateurs:

 $(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' } } } } }); }); 

Lorsque vous utilisez BootstrapValidator avec Bootstrap-datetimepicker ou Bootstrap-datepicker, vous devez ré-valider le champ de date.

Vous devriez donc ajouter ceci:

1) avec bootstrap-datetimepicker:

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

2) avec bootstrap-datepicker:

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

Consultez l' exemple de datetimepicker pour plus d'informations.

D'une certaine manière, après avoir sélectionné une date, datepicker () perd la mise au point du champ de la date et aucun des plugins du validateur ne peut voir le champ de saisie de la date rempli (valide). En conclusion, un simple .focus () fait l'affaire.

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

La réponse ci-dessus acceptée ne m'a pas fonctionné. Ce qui m'a fonctionné était très simple.

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

J'espère que cela t'aides!

Pour la plupart des cas, les réponses ci-dessus devraient fonctionner, mais si éventuellement toutes ces réponses ne fonctionnent pas pour vous, cela pourrait aussi essayer:

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

L'idée principale dans ce script est de forcer les validations par "setting" et après "dissocier" la mise au point. Je comprends que ce serait similaire à imiter les événements normaux qui permettent d'exécuter des validations.

Bonne chance!