jQuery DatePicker Min Max dates

Question

I have the jQuery date picker setup and working but would like help with setting the minDate and maxDate options. My current code is below (without these options). How can

Answer 1

You can also use specific date ranges. I added a min beginning date with a +14D max. You just need to remember to stay consistent with your date format and use "/" instead of "-" between MM/DD/YYYY.

$('#Date').datepicker({
  changeMonth: true,
  minDate: '10/19/2016',
  maxDate: '+14D',
});

Answer 2

$(document).ready(function () {
    $('input[id$=tbDate]').datepicker({   
        dateFormat: 'dd-mm-yy',
         minDate: '-0D',
         maxDate: '+28D',
    });
});

Answer 3

$(function() {

    $( "#datepicker" ).datepicker({ 
        changeYear: true,
        minDate: '-3M',
        maxDate: '+28D',
    });
});

JSFiddle Demo

UPDATE

You can calculate tour max and min valid dates from the default date, then assign it to the date picker.

var expdisp = $("#expdisp").attr("value");

$("#expirydate" ).datepicker({
    showOn: "button",
    buttonImage: "images/calendar.gif",
    buttonImageOnly: true,
    dateFormat: "dd/mm/yy",
    defaultDate: expdisp,
    showOtherMonths: true,
    selectOtherMonths: true,
    changeMonth: true,
    changeYear: true,

    minDate: '-3M',
    maxDate: '+28D',
});

Update Demo

Answer 4

maxDate :- Sets the maximum date that can be selected. Accepts a date object or a relative number. For example: +7, or a string such as +6m.

minDate :- Sets the minimum date that can be selected. Accepts a number, date object, or string.

$(document).ready(function() {
  $("#date").datepicker({
      minDate: -3,
      maxDate: "1w"
  });

});

Refer:-set Minimum and maximum date to jquery datepicker

Answer 5

Your could try:

var expdisp = $("#expdisp").attr("value");

$("#expirydate" ).datepicker({
    showOn: "button",
    buttonImage: "images/calendar.gif",
    buttonImageOnly: true,
    dateFormat: "dd/mm/yy",
    defaultDate: expdisp,
    showOtherMonths: true,
    selectOtherMonths: true,
    changeMonth: true,
    changeYear: true,

    minDate: -3M,
    maxDate: +28D
});

Answer 6

var startDate = new Date(); // Now
var endDate = new Date();
endDate.setDate(startDate.getDate() + 30); // Set now + 30 days as the new date
$('#myDatePicker').datepicker('setEndDate', endDate);//1st set  end date
$('#myDatePicker').datepicker('setStartDate', startDate);//