datepicker disable futures dates

70 Views Asked by At

I would like to disable future dates (starting with the day after tomorrow) using datapicker, but it's not working. I tried 3 solutions:

  maxDate: 0

and

 maxDate: '0'

and

  maxDate: new Date();

All of them not working. Does anyone have any idea why not? Here is my code:

 $('#datepicker').datepicker({
   format: "dd-mm-yyyy",
   maxDate: 0
 });
3

There are 3 best solutions below

1
Pedro Lima On

I'm assuming you're using bootstrap-datepicker. If that's the case, you should be using endDate, not maxDate.

If you're using another script, would be helpful adding this info to your question.

0
Lionel Rowe On

With jQuery 3.3.1 and jQuery UI 1.12.1, this works fine:

<p>Date: <input type="text" id="datepicker"></p>
$('#datepicker').datepicker({
  maxDate: new Date()
});

JS Fiddle demo

0
Twisty On

If you are using jQuery UI, consider this:

http://api.jqueryui.com/datepicker/#option-maxDate

The maximum selectable date. When set to null, there is no maximum.

Multiple types supported:

  • Date: A date object containing the maximum date.
  • Number: A number of days from today. For example 2 represents two days from today and -1 represents yesterday.
  • String: A string in the format defined by the dateFormat option, or a relative date. Relative dates must contain value and period pairs; valid periods are "y" for years, "m" for months, "w" for weeks, and "d" for days. For example, "+1m +7d" represents one month and seven days from today.

I would try the following:

$(function() {
  $('#datepicker').datepicker({
    format: "dd-mm-yyyy",
    maxDate: 2
  });
});
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>

<p>Date: <input type="text" id="datepicker"></p>