CODEWITHSUNDEEP
javascriptjqueryjquery-uidatepicker
Broadbiz
Broadbiz

Reputation: 25

jQuery UI Datepicker - Month and Year Dropdown

I have the following Datepicker on my website.

As you can see from the example they have, it only goes as back as 2006 and as forward as 2026 on the year. I need the year to go back a lot further, how would I accomplish this?

Here is my code:

<script>
    $(function() {
        $("#passenger_dob").datepicker({ changeMonth: true, changeYear: true, dateFormat: "dd/mm/yy" }).val()
    });
</script>

Upvotes: 2

Views: 30818

Answers (1)

ADyson
ADyson

Reputation: 61839

Use the yearRange option to set the years you want do display:

$("#passenger_dob").datepicker({
    changeMonth: true, 
    changeYear: true, 
    dateFormat: "dd/mm/yy",
    yearRange: "-90:+00"
});

the yearRange options can be hard-coded, or, as in my example, a range can be used relative to the current date. The options I've used mean "earliest year displayed is 90 years before current year" and "maximum year displayed is equal to current year".

N.B. As noted in the docs, this merely affects the options displayed in the dropdown by default, it doesn't place any restriction on the dates which the user can actually enter/select.

See http://api.jqueryui.com/datepicker/#option-yearRange for more details.

Upvotes: 10

Related Questions