Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery DatePicker Min Max dates

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 I set the minDate as 3 months before the defaultDate, and maxDate as 28days after the defaultDate?

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,
});
like image 803
Rob Avatar asked Feb 01 '13 12:02

Rob


2 Answers

$(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

like image 67
Muhammad Hani Avatar answered Nov 10 '22 10:11

Muhammad Hani


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

like image 2
ramsurya Avatar answered Nov 10 '22 08:11

ramsurya