javascript - Prueba si el elemento ya tiene jQuery datepicker

datepicker options

Question

Tengo un formulario con muchos elementos de entrada. Algunos son campos de fecha con jQuery UI datepicker alraedy adjunto:

$("#someElement").mask("9?9/99/9999").datepicker({showOn: ''button'', buttonText:''Click here to show calendar'', duration: ''fast'', buttonImageOnly: true, buttonImage: /images/calicon.gif'' });

Luego tengo un comando de teclado vinculado a esta función:

function openCalendar() {
    var selection = document.activeElement;

    // { Need to test here if datepicker has already been initialized 
        $(selection).datepicker("show");
    // }
}

Esto funciona muy bien para los elementos que ya tienen el datepicker en ellos. Sin embargo, cualquier otro campo generará un error de javascript. Me pregunto cuál es la mejor manera de probar si Datepicker ya se ha inicializado en ese campo.

Answer 1

1) Si el código arroja un error al intentar abrir el datepicker, puede poner el código en try..catch

2) Puede establecer algunos datos en el campo de entrada al inicializar el selector de fecha

$("#someElement").data("datepicker-initialized", true);

3) Puede usar los datos almacenados por el plugin datepicker

if($("#someElement").data("datepicker") != null){
   // datepicker initialized
}

o

if($.data($(''#someElement'').get(0), ''datepicker'')){
   // datepicker initialized
}

4) datepicker usa internamente una función _getInst

if($.datepicker._getInst($(''#someElement'')[0]) != null){}

el método hace casi lo mismo que el ejemplo 3.

No se pudo encontrar una mejor solución.

Answer 2

Esta fue mi solución :)

if(typeof jQuery.fn.datepicker !== "undefined")

Answer 3

Tengo otro caso. Mi script está copiando los últimos elementos de la tabla, incluyendo datepicker.

El jquery no funcionará porque el elemento copiado tiene la marca que dice "hasDatepicker".

Para activar datepicker en un nuevo elemento, elimine ese nombre de clase y lo inicie, así.

 $("#yournewelementid").attr("class","your-class-name"); 
 $("#yournewelementid").datepicker();    

Answer 4

Una solución básica es establecer un atributo al momento del archivo adjunto datepicker y luego probarlo:

$("#someElement").mask("9?9/99/9999")
.datepicker({showOn: ''button'', buttonText:''Click here to show calendar'', duration: ''fast'', buttonImageOnly: true, buttonImage: /images/calicon.gif'' })
.attr("data-calendar", "true");

Entonces podrías hacer:

if ($(selection).attr("data-calendar") == "true")
    $(selection).datepicker("show");

¿Hay una manera más directa?

Answer 5

Wow no puedo creer que me haya perdido esta. Línea 108 de ui.datepicker.js:

/* Class name added to elements to indicate already configured with a date picker. */
markerClassName: ''hasDatepicker'',

Entonces solo necesito probar hasClass(''hasDatepicker'') . Esta parece ser la forma más directa. Además, esta declaración verifica si el datepicker está actualmente abierto (para cualquiera que esté interesado):

if ($("#ui-datepicker-div").is(":visible") && $("#ui-datepicker-div").html() != "") {
    // datepicker is open. you need the second condition because it starts off as visible but empty
}