JQuery datePicker: start/end date should be within one year
So if my start date is : 04/22/2010
then my end date selection can be up to 04/22/2011
and after 04/22/2011
are dates all disabled.
Here is what I have for both selection start and end date:
$(document).ready(function () {
$('#endDate').datepicker({ showOn: 'button',
buttonImage: '../images/Calendar.png',
buttonImageOnly: true, onSelect: function () { },
onClose: function () { $(this).focus(); }
});
$('#startDate').datepicker({ showOn: 'button',
buttonImage: '../images/Calendar.png',
buttonImageOnly: true, onSelect:
function (dateText, inst) {
$('#endDate').datepicker("option", 'minDate', new Date(dateText));
开发者_如何学JAVA }
,
onClose: function () { $(this).focus(); }
});
});
You can set the maxDate
option at the same time, like this:
$(document).ready(function () {
$('#endDate').datepicker({ showOn: 'button',
buttonImage: '../images/Calendar.png',
buttonImageOnly: true, onSelect: function () { },
onClose: function () { $(this).focus(); }
});
$('#startDate').datepicker({ showOn: 'button',
buttonImage: '../images/Calendar.png',
buttonImageOnly: true,
onSelect: function (dateText, inst) {
var nyd = new Date(dateText);
nyd.setFullYear(nyd.getFullYear()+1);
$('#endDate').datepicker("option", { minDate: new Date(dateText),
maxDate: nyd });
},
onClose: function () { $(this).focus(); }
});
});
You can play with a working demo here
This just gets the date, adds a year (don't use .getYear
/.setYear
, they're deprecated) and uses that date to set the maxDate
property on the other date picker. If you're curious, there's a helpful maintained list of javascript Date
methods here.
精彩评论