Can I make the jQuery datepicker display more year

2019-03-04 13:52发布

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);
    }
});

2条回答
Evening l夕情丶
2楼-- · 2019-03-04 13:52

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.

enter image description here

This is one shortest way to reach the year soon.

查看更多
forever°为你锁心
3楼-- · 2019-03-04 14:19

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.

查看更多
登录 后发表回答