2010-10-14 9 views
11

J'ai le code suivant pour l'datepicker jQuery UI:classe pour jquery ui bouton datepicker

$(function() { 
     $(".date").datepicker({ 
      showOn: 'button', 
      buttonText: "Choose Date", 
      dateFormat: 'yy-mm-dd' 
     }); 
    }); 

Il crée un bouton sur le côté de la zone de texte afin que les gens peuvent cliquer sur la case et sélectionnez une date. Est-il possible d'appliquer une classe au bouton créé pour pouvoir appliquer un style CSS?

Répondre

21

Vous ne pouvez pas ajouter une classe supplémentaire par le biais d'une option, mais il a une classe: ui-datepicker-trigger, donc si vous le style juste directement ou en tant que descendant d'un conteneur identifiable, elle va travailler, par exemple:

.ui-datepicker-trigger { color: red; } 
//or... 
.myContainer .ui-datepicker-trigger { color: red; } 

Ou, ajoutez une autre classe au bouton manuellement après la création du datepicker (qui crée le bouton):

$(function() { 
    $(".date").datepicker({ 
     showOn: 'button', 
     buttonText: "Choose Date", 
     dateFormat: 'yy-mm-dd' 
    }).next(".ui-datepicker-trigger").addClass("someClass"); 
}); 
+0

Merci beaucoup! Il fonctionne comme: .ui-datepicker-trigger {color: red;} Pas besoin de mettre le .dateContainer –

+0

@Doug - Je ne savais pas si vous le vouliez plus spécifique ou non, je vous donne juste des options:) heureux soit l'approche était ce que vous recherchiez :) –

+0

Il est préférable d'être plus précis parfois parce que vous pouvez avoir plus d'un datepicker sur la même page. – Tebo