0

J'utilise Eonasdan Bootstrap DateTimePicker: http://eonasdan.github.io/bootstrap-datetimepicker/Bootstrap DateTimePicker mauvaise date par défaut avec MinDate

Bien que je ne peux pas obtenir le MinDate et maxDate à travailler comme prévu. Depuis la date est dynamique et change le violon est réglé UPP avec moments.js' Soustraire/ajouter

Conditions

minDate = today + 1 day 
maxDate = today + 3 days 
default value = today + 2 days 

Les __gVirt_NP_NNS_NNPS<__ rendements supérieurs à la valeur de demain et non pas la valeur par défaut. Si minDate est modifié à -2 jours cela fonctionne très bien.

Voir Fiddle: http://jsfiddle.net/9uqpu88v/8/

twoDaysFromToday = moment().add(2, 'd').format('YYYY-MM-DD'); 

$('#datetimepicker1 input').val(twoDaysFromToday); 
     var datetimepicker = $('#datetimepicker1').datetimepicker({ 
     format: 'YYYY-MM-DD', 
     minDate: moment().add(1, 'd').format('YYYY-MM-DD'), // Tomorrow 
     maxDate: moment().add(3, 'd').format('YYYY-MM-DD'), // Three days from today 
    }) 


<div class="form-group"> 
    <div class="input-group date" id="datetimepicker1"> 
    <input type="text" id="datetimepicker1" class="form-control" value="" />  
    <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span> 
    </div> 
</div> 
+0

Quel est exactement 'instant()' faire? – Jonathan

+0

Je ne vois aucun problème dans votre violon ('minDate' et' maxDate' ont la valeur "hardcoded" donnée), alors que votre extrait manque les bibliothèques requises. Quoi qu'il en soit, je suggère d'utiliser le format de spécification de la fonction d'analyse du moment (voir [docs] (http://momentjs.com/docs/#/parsing/string-format/)). Dans votre exemple: 'moment ('2016-07-01,' AAAA-MM-JJ ')' au lieu de 'moment (' 2016-07-01 ')'. – VincenzoC

+0

J'ai modifié le violon –

Répondre

0

Vous pouvez passer l'objet moment au lieu de chaîne à minDate et maxDate. Utilisez l'option defaultDate pour définir la valeur sur votre sélecteur au lieu de jQuery val(). Notez que la bibliothèque fournit également une méthode date pour définir la valeur pour le composant.

Utilisez le moment startOf pour être indépendant des heures.

Voici un exemple de travail:

var datetimepicker1 = $('#datetimepicker1').datetimepicker({ 
 
    format: 'YYYY-MM-DD', 
 
    useCurrent: false, 
 
    defaultDate: moment().startOf('day').add(2, 'd'), 
 
    minDate: moment().startOf('day').add(1, 'd'), 
 
    maxDate: moment().startOf('day').add(3, 'd') 
 
})
<link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/css/bootstrap.css" rel="stylesheet"/> 
 
<link href="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.css" rel="stylesheet"/> 
 

 
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/moment.js/2.13.0/moment.min.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.6/js/bootstrap.js"></script> 
 
<script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script> 
 

 
<div class="form-group"> 
 
    <div class="input-group date" id="datetimepicker1"> 
 
    <input type="text" class="form-control" /> 
 
    <span class="input-group-addon"><span class="glyphicon-calendar glyphicon"></span></span> 
 
    </div> 
 
</div>