web-dev-qa-db-fra.com

Teste si l'élément a déjà jQuery datepicker

J'ai un formulaire avec de nombreux éléments d'entrée. Certains sont des champs de date auxquels jrau UI datepicker alraedy est attaché:

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

Ensuite, j'ai un raccourci clavier lié à cette fonction:

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

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

Cela fonctionne très bien pour les éléments qui ont déjà la datepicker. Cependant, tous les autres champs génèrent une erreur javascript. Je me demande quel est le meilleur moyen de vérifier si datepicker a déjà été initialisé sur ce champ. 

javascriptjqueryjquery-uidatepicker
36
macca1

Wow ne peux pas croire que j'ai raté celui-ci. Ligne 108 de ui.datepicker.js:

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

Donc, je dois juste tester pour hasClass('hasDatepicker'). Cela semble être le moyen le plus simple. En outre, cette déclaration vérifie si le datepicker est actuellement ouvert (pour toute personne intéressée):

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
}
65
macca1

1) Si le code génère une erreur lors de la tentative d'ouverture du sélecteur de date, vous pouvez le placer dans try..catch

2) Vous pouvez définir des données dans le champ de saisie lors de l’initialisation du sélecteur de date.

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

3) Vous pouvez utiliser les données stockées par le plugin datepicker

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

ou

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

4) datepicker utilise en interne une fonction _getInst

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

la méthode fait presque la même chose que l'exemple 3.

Impossible de trouver une meilleure solution.

10
Rafael

Une solution de base consiste à définir un attribut au moment de la pièce jointe datepicker, puis à le tester

$("#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");

Ensuite, vous pourriez faire:

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

Y a-t-il un moyen plus direct?

1
macca1

J'ai un autre cas. Mon script copie les derniers éléments de la table, y compris datepicker.

JQuery ne fonctionnera pas car l'élément copié a la marque "hasDatepicker".

Pour activer datepicker dans un nouvel élément, supprimez ce nom de classe et lancez-le, comme ceci.

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

Si section est votre élément dom pour datepicker, vérifiez s'il est déjà initialisé et s'il n'est pas initialisé en tant que datepicker (vous pouvez ajouter des propriétés), puis affichez-le!

    // If already initialized        
    if ( typeof selection !== 'undefined' && selection.length > 0)
         $(selection).datepicker('show');
    // otherwise initialize first and show
    else 
         $(selection).datepicker().datepicker('show');
0
Zhelyo Hristov