I am using the jQuery datepicker in an application which will be used, among other things, to insert and update birth dates of employees. I find it cumbersome to have to click several times in order to get to the 70's and 80', decades in which many employees are born in. Is there a way to access these 'further' years in less clicks?
This is what my datepicker looks like
$("#DateOpened").datepicker({
dateFormat: "mm/dd/yy",
maxDate: "+0D",
showAnim: 'slide',
changeMonth: true,
changeYear: true,
'setDate': new Date(),
onClose: function (selectedDate) {
$("#DateClosed").datepicker("option", "minDate", selectedDate);
}
});
Use the yearRange
option to increase the size of the year drop-down.
yearRange: "c-30:+0"
will allow selecting a year after 1983 in one click, and the 70's in 2 clicks.
FIDDLE
However, this isn't a good UI. When the user first clicks on the menu, it's not obvious that they can go back more than 30 years by first selecting an old year and then clicking on the menu again. You can use c-100:+0
to allow the menu to contain 100 years, hopefully this wil be enough for most users.
If I understood correctly, then yes it is possible using minDate
and maxDate
options. Here you can set the year that has to be shown.
changeYear: true,
minDate: '-1Y', //decrease 1 year from current year
maxDate: '+2Y' //increase 2 from current year
Y
represent year.
This is one shortest way to reach the year soon.