Search code examples
twitter-bootstrap-3datetimepickereonasdan-datetimepicker

Bootstrap3 DateTimePicker: minDate option set the input value field


I have a problem where setting the minDate option set the input value field. Why??

(When I write this post, input date is after minDate)

Html:

<div class="row">
    <div class="col-md-12">
        <h6>datetimepicker</h6>
        <input type="text" class="form-control" id="datetimepicker" value="21/12/2016"/>
    </div>
</div>

Javascript:

$('#datetimepicker').datetimepicker({
    locale: 'fr',
    //minDate: moment(), If I uncomment it the input value field changes to current date
    format: 'DD/MM/YYYY'
});

Fiddle


Solution

  • You have to add the useCurrent option and set it to false.

    Here a working example:

    $('#datetimepicker').datetimepicker({
      locale: 'fr',
      minDate: moment(),
      useCurrent: false,
      format: 'DD/MM/YYYY'
    });
    <link href="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/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.17.1/moment-with-locales.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script>
    
    <div class="row">
      <div class="col-md-12">
        <h6>datetimepicker</h6>
        <input type="text" class="form-control" id="datetimepicker" value="21/12/2016"/>
      </div>
    </div>