Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery datepicker year range default

Having a bit of an issue with the JQuery datePicker, I suspect it's just the matter of a setting I've overlooked or got wrong.

If you look at this simple fiddle: JS Fiddle

You'll see I've set the year range, so that the by default when you click on the input it will open it up on 1994, but if you then click on any of those dates, e.g. 3rd Sept, it'll actually put it in the input as 2012 still, rather than the year that is selected in the drop down menu.

How can I make it so that it uses the correct year without having to change the drop down and then change it back again?

Cheers.

like image 989
CMR Avatar asked Sep 13 '12 13:09

CMR


People also ask

How to use datepicker using jQuery?

The datepicker is tied to a standard form input field. Focus on the input (click, or use the tab key) to open an interactive calendar in a small overlay. Choose a date, click elsewhere on the page (blur the input), or hit the Esc key to close. If a date is chosen, feedback is shown as the input's value.

How can change date format in jQuery ui datepicker?

inside the jQuery script code just paste the code. $( ". selector" ). datepicker({ dateFormat: 'yy-mm-dd' });


2 Answers

As others have suggested, you have to set the defaultDate. However, unlike the other solutions, you don't want to hardcode the date since your dropdown list will be updating as the years pass since you're doing a relative list.

Try this instead...

function loadDatePicker() {
    $('.datePicker').datepicker({
        dateFormat: 'yy-mm-dd',
        changeYear: true,
        changeMonth: true,
        yearRange: "-18:-12",
        defaultDate:"-18y-m-d"  // Relative year/month/day
    });
}
like image 120
JasCav Avatar answered Sep 21 '22 02:09

JasCav


Weird, but adding defaultDate:"1994-01-01" to the datepicker options seems to fix it.

Fiddle

like image 22
vonflow Avatar answered Sep 24 '22 02:09

vonflow