DatePicker de jQuery ne montrant pas

Bonjour, je suis en train de créer une zone de texte simple avec un datepicker qui s'affiche lorsqu'un utilisateur clique à l'intérieur de l'il. J'ai le texte suivant chargés dans ma tête:

<link rel="stylesheet" href="css/start/jquery-ui-1.8.13.custom.css">
<script src="js/jquery-1.5.1.min.js"></script>
<script src="js/jquery-ui-1.8.13.custom.min.js" type="text/javascript"> </script><!-- Was missing closing tag
<script>
    $(function() {
        $( "#datepicker" ).datepicker();
    });
</script>

Et dans mon corps, j'ai la zone de texte suivante:

<body>

    <input id="datepicker" class="hasDatepicker" type="text">

</body>

Mon problème est que lorsque j'essaie de cliquer à l'intérieur de la zone de texte, rien ne se passe. Je ne suis pas sûr de ce que peut être le problème. Toutes les suggestions sont les bienvenues.

Mise à JOUR:

Essayé de la CAN et aussi téléchargé l'ensemble de jQuery UI paquet et encore de ne pas s'afficher. Essayé dans les deux IE et Firefox.

Mise à JOUR 2:

Espérais que l'erreur de syntaxe j'ai corrigé ci-dessus permettrait de régler le problème, mais pas de dés.

Votre utilisation d'un package personnalisé pour jQuery UI, êtes-vous sûr qu'il comprend le datepicker exigences ?
Ce que @Zachary dit.
Je vais revérifier, je suis à la recherche de la petite démo qui vient avec la version téléchargeable, package personnalisé et cela se voit bien sur il. Quelles sont les datepicker exigences?

OriginalL'auteur kingrichard2005 | 2011-06-09

20

jQuery UI ajoute le "hasDatepicker" classe à l'entrée, après il est cliqué. Essayez de supprimer le hasDatepicker classe. Si vous utilisez un sélecteur jQuery tels que $('.hasDatepicker') pour sélectionner l'entrée(s), essayez de lui donner un autre nom de la classe.

bon appel! J'ai eu ce problème

OriginalL'auteur Chris Peterson
3

J'ai eu un problème similaire.

Ouvrir la feuille de style et de trouver .ui-helper-hidden-accessible.

Si il y a une ligne en double pour clip: rect(1px,1px,1px,1px);, le supprimer (vous pouvez avoir besoin de supprimer les deux). Le problème est résolu pour moi.

Il y avait une ligne en double, mais cela ne semble pas résoudre le problème.
j'ai supprimé tous les deux et il a travaillé pour moi - bizarre
Je vais mettre à jour la réponse de dire que l'un ou les deux! Merci!

OriginalL'auteur Jim Schubert
2

Veuillez retirer la classe hasDatepicker de balise d'entrée et il devrait fonctionner correctement.
```
class = 'hasDatepicker' //Need to remove
```
OriginalL'auteur Michelle Rodrigues

Utiliser le CDN de test afin de vous assurer de la complète de jQuery UI. Votre appelant à droite...

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js" charset="utf-8"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js" charset="utf-8"></script>

OriginalL'auteur Zachary

0

Si vous avez plusieurs instances du sélecteur de date essayez d'utiliser une classe plutôt que l'identité, la raison d'être est l'ID doit être unique à l'élément ou de l'appel de jQuery ne peut pas exécuter la fonction, c'est parce que la fonction ne saurez quel élément de la page pour placer le script dans.

Le script devrait ressembler à ceci
```
<script>
    $(function() {
        $( ".datepicker" ).datepicker();
    });
</script>
```
Et l'élément devrait ressembler à ceci
```
<input id="myInput" class="datepicker hasDatepicker" type="text">
```
J'espère que cette aide

OriginalL'auteur Ryan
0

Je suis sûr que vous aurez fixé ce, en maintenant, mais voici quelques choses que j'aurais essayé:

Vous assurer que vous êtes saisissant jQuery suivie par jQuery UI et d'une feuille de style pour .datepicker existe.

Il changer la recherche d'un ID de catégorie comme datepicker met son propre ID.

Si c'était un événement click assurez-vous qu'un datepicker n'a pas encore été appliquée à l'élément (donc une nouvelle datepicker pour chaque nouvel élément). E. G:
```
$(".addOffer").click(function(){
    //Code to add an offer (ensuring it has the class .latest)
    $("#offers").append("<input type='text' name='datePicker' class='datepickerNew latest' />");

    //Add date picker
    $("#offers .latest.datepickerNew").datepicker().removeClass('latest');
});
```
OriginalL'auteur Steve

J'ai eu le même problème.
Ma résolution était d'ajouter z-index dans .date-picker de datePicker.css

.date-picker {
position: absolute;
z-index:1000;/*********** MY Change *************/
font-size: 1em;
color: #CCC;
text-align: center;
cursor: default;

border: 1px solid #444;
border-radius: 2px;
margin: 6px 0;
background: #222;
box-shadow: 8px 8px 12px rgba(0, 0, 0, 0.2);}

Et avec ce changement, le Sélecteur de Date a commencé à afficher.

OriginalL'auteur jAntoni

Vous devez vous connecter pour publier un commentaire.