Question

I’m trying to add a simple datepicker to my form and it is working fine except for a small issue I happened to stumble upon. The datepicker has a dropdown to select a year with a range of -70 years to the present.

The issue is that when you select a year from the dropdown, all years between the selected year and the current year a removed from the dropdown (for example, if I select 1995 from the dropdown menu, 1996-2011 no longer appear in the dropdown). If you navigate away from the datepicker and go back, all the years appear again.

Here is the code:

$('document').ready(function() {
  $('#date').datepicker({
    showOn: 'button',
    showAnim: 'fadeIn',
    showOptions: {speed: 'fast'},
    mandatory: false,
    buttonImage: 'calendar_event.gif',
    buttonImageOnly: true,
    changeMonth: true,
    changeYear: true,
    minDate: '-70y',
    yearRange: '-70:+0'
  });  
});

Does anyone know what would cause this behavior?
Thanks in advance for the help.

Answer 1

I ran your exact code with jQuery 1.4.2 and jQueryUI 1.8.14, and it worked as expected. If you aren’t already running the latest version of the libraries, I would try that first.

It is possible that something else in your code is causing the issue as well. If you put the code into an empty test bed and it works, then your culprit is most likely another function you have written (e.g. a global event handler on select box change).