CODEWITHSUNDEEP
jqueryjquery-uicalendar
Kurkula
Kurkula

Reputation: 6762

Jquery UI Calender showing wrong date

I am not sure what might be the issue but JqueryUI calender behaves weird on entering dates in date picker text box Ex: 7/7/25 takes 1925 and 7/7/24 takes 2024.

Here is the code

<p>Date: <input type="text" id="datepicker"></p>
 $(function() {
    $( "#datepicker" ).datepicker();
  });

Upvotes: 0

Views: 581

Answers (1)

Damien Black
Damien Black

Reputation: 5647

You need to use the value "shortYearCutoff" with the datePicker to tell it what to do when the user puts in an ambiguous "short year" (a two digit year) :

$( "#datepicker" ).datepicker({
    shortYearCutoff: 50;
})

This'll make it so that any "short year" before 50 will be considered in this century, as in 2035. 50+ will be last century, as in 1985. If you want all short years to be 2000 something, use the value 99, like this:

$( "#datepicker" ).datepicker({
    shortYearCutoff: 99;
})

The default value for this is "+10", which means any year within 10 are considered this century. If you want your code to adjust based on the current year, you can send in "+20" or some other value, like this:

$( "#datepicker" ).datepicker({
    shortYearCutoff: "+20";
})

Alternatively, if you can narrow down which years are allowed, you can use minDate and maxDate to set the range.

$( "#datepicker" ).datepicker({
    minDate: new Date(2009, 1 - 1, 26), 
    maxdate: new Date(2050, 1 - 1, 26)
});

That will help it decide what date it chooses when you put in an ambiguous date. You can also do things like:

maxDate: "+1m +1w"

for a month and a week in the future.

For a full list of all of the options you can send to the datePicker, check the datePicker API.

Upvotes: 2

Related Questions