Search code examples
jquerydatepickerbootstrap-4bootstrap-datepickermaxdate

minDate and maxDate options are not working in datepicker


I'm using the "datepicker" plugin on my project, it's set to decade view, and I want to disable the future dates, for this I have used the maxDate option but it's not working, my code:

$('#data_1 .input-group.date').datepicker({
    todayBtn: "linked",
    maxDate: "0",
    keyboardNavigation: false,
    forceParse: false,
    calendarWeeks: true,
    autoclose: true
});

tried with 0 and new Date


Solution

  • Note that bootstrap-datepicker has no maxDate option, you have to use endDate.

    Here a working sample:

    $("#datepicker").datepicker({
      todayBtn: "linked",
      endDate: new Date(),
      keyboardNavigation: false,
      forceParse: false,
      calendarWeeks: true,
      autoclose: true
    });
    <link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/css/bootstrap.css" rel="stylesheet"/>
    <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/css/bootstrap-datepicker3.css" rel="stylesheet"/>
    
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.7/js/bootstrap.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.6.4/js/bootstrap-datepicker.js"></script>
    
    <input type="text" class="form-control" id="datepicker">