español - Se muestran jQuery datepicker años

jquery datepicker format

Question

Con jQuery datepicker, ¿cómo se puede cambiar el rango de año que se muestra? En el sitio jQuery UI dice que el valor predeterminado es "10 años antes y después de que se muestre el 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 demo de datepicker: http://jqueryui.com/demos/datepicker/#dropdown-month-year

Answer 1

¿Por qué no mostrar los cuadros de selección de año o mes?

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

Answer 2

Añadiendo a lo que se publicó @ Shog9, también puede restringir las fechas individualmente en la función beforeShowDay: callback.

Usted proporciona 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, '''']; 
} 

Answer 3

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

$(".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 googlers encuentren esto útil :).

Answer 4

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 pasan a aplicar para ese día como estilo CSS. Los estilos correspondientes son de la forma que se muestra a continuación, que mueve el texto para ese día fuera del camino 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 transfiere con el nuevo estilo indica que actualmente no se puede seleccionar.

Answer 5

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''
    });

Answer 6

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

por ejemplo:

yearRange: "1901:2012"

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

Answer 7

Si miras un poco la página de demostración, verás una sección de "Restricción de fechador". Use el menú desplegable para especificar la Year dropdown shows last 20 years " Year dropdown shows last 20 years " y presione la fuente de vista:

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

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

Answer 8

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

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

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

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