Se muestran los años de jQuery datepicker

Con jQuery datepicker, ¿cómo se cambia el rango de años que se muestra? En el sitio de jQuery UI dice que el valor predeterminado es "Se muestran 10 años antes y después del año actual". Quiero usar esto para una selección de cumpleaños y 10 años antes de hoy no es bueno. ¿Se puede hacer esto con jQuery datepicker o tendré que usar una solución diferente?

enlace a la demostración de datepicker: http://jqueryui.com/demos/datepicker/#dropdown-month-year

Si mira un poco la página de demostración, verá una sección "Restricción de selector de fechas". Utilice el menú desplegable para especificar la " Year dropdown shows last 20 years" demostración y presione ver fuente:

$("#restricting").datepicker({ 
    yearRange: "-20:+0", // this is the option you're looking for
    showOn: "both", 
    buttonImage: "templates/images/calendar.gif", 
    buttonImageOnly: true 
});

Querrás hacer lo mismo (obviamente cambiando -20a -100o algo así).

¿Por qué no mostrar las casillas de selección de año o mes?

$( ".datefield" ).datepicker({
    changeMonth: true,
    changeYear: true,
    yearRange:'-90:+0'
});

lo que nadie más ha puesto es que también puede establecer rangos de fechas codificados:

por ejemplo:

yearRange: "1901:2012"

aunque puede ser aconsejable no hacer esto, es una opción que es perfectamente válida (y útil si está buscando legítimamente, digamos, un año específico en un catálogo, como "1963: 1984").

Perfecto para los campos de fecha de nacimiento (y lo que yo uso) es similar a lo que dijo Shog9, aunque voy a dar un ejemplo de DOB más específico:

$(".datePickerDOB").datepicker({ 
    yearRange: "-122:-18", //18 years or older up to 122yo (oldest person ever, can be sensibly set to something much smaller in most cases)
    maxDate: "-18Y", //Will only allow the selection of dates more than 18 years ago, useful if you need to restrict this
    minDate: "-122Y"
});

Espero que los futuros usuarios de Google encuentren esto útil :).

Además de lo que publicó @ Shog9, también puede restringir las fechas individualmente en la función beforeShowDay: callback.

Proporcionas una función que toma una fecha y devuelve una matriz booleana:

"$(".selector").datepicker({ beforeShowDay: nationalDays}) 
natDays = [[1, 26, 'au'], [2, 6, 'nz'], [3, 17, 'ie'], [4, 27, 'za'], 
[5, 25, 'ar'], [6, 6, 'se'], [7, 4, 'us'], [8, 17, 'id'], [9, 7, 
'br'], [10, 1, 'cn'], [11, 22, 'lb'], [12, 12, 'ke']]; 
function nationalDays(date) { 
    for (i = 0; i < natDays.length; i++) { 
      if (date.getMonth() == natDays[i][0] - 1 && date.getDate() == 
natDays[i][1]) { 
        return [false, natDays[i][2] + '_day']; 
      } 
    } 
  return [true, '']; 
} 

 $("#DateOfBirth").datepicker({
        yearRange: "-100:+0",
        changeMonth: true,
        changeYear: true,
    });

yearRange: '1950: 2013', // especificando un rango de años codificado o de esta manera

yearRange: "-100: +0", // últimos cien años

Ayudará a mostrar el menú desplegable para la selección de año y mes.

au, nz, ie, etc. son los códigos de país para los países cuyos días nacionales se muestran (Australia, Nueva Zelanda, Irlanda, ...). Como se ve en el código, estos valores se combinan con '_day' y se devuelven para aplicarse a ese día como estilo CSS. Los estilos correspondientes son del formulario que se muestra a continuación, que aparta el texto de ese día y lo reemplaza con una imagen de la bandera del país.

.au_day {
  text-indent: -9999px;
  background: #eee url(au.gif) no-repeat center;
}

El valor 'falso' que se devuelve con el nuevo estilo indica que estos días no se pueden seleccionar.

Creo que esto también puede funcionar

$(function () {
    $(".DatepickerInputdob").datepicker({
        dateFormat: "d M yy",
        changeMonth: true,
        changeYear: true,
        yearRange: '1900:+0',
        defaultDate: '01 JAN 1900'
    });