Spectacle de JQuery UI datepicker sur le champ de saisie, cliquez sur?

OK c'est peut-être une question triviale, mais je suis très curieux de voir si quelqu'un a des idées sur ce:

Je suis à l'aide de JQuery UI. J'ai un <input id="#myfield" type="text"> champ et j'appelle $('#myfield').datepicker(). Le datepicker montre chaque fois que le champ est activé. Mais le champ est le premier dans mon formulaire et est déjà l'accent quand il charge, donc un clic sur le champ, ne pas le montrer. Aussi, si je ferme le datepicker avec la touche Échap, puis je ne peux pas l'ouvrir à nouveau en cliquant sur le champ, pour la même raison: il est déjà au point.

Je suis conscient que je pourrais définir le paramètre .datepicker({showOn: 'button'}) mais je ne veux pas le bouton. Est-il possible d'avoir le datepicker apparaissent lorsque le champ est activé OU est cliqué quand déjà? J'ai déjà essayé $('#myfield').click( function () { $(this).focus() } ) et il fait le datepicker ouvrir correctement lorsque je clique sur le champ de saisie, mais ensuite lorsque je sélectionne une date, elle n'apparaît pas dans le domaine.

J'aime bien le bouton, c'est assez normal de les utiliser, en fait, je dirais que sa mauvaise décision de ne pas l'utiliser.
Normalement, je serai d'accord avec vous. Voir mon commentaire ci-dessous Rohan de Büchner réponse sur pourquoi je ne veux pas le bouton.

OriginalL'auteur alexg | 2012-05-23

  1. 17

    Essayer cette

    <html>
<head>
<script type="text/javascript" src="jquery-1.7.1.min.js"></script>
<script type="text/javascript" src="jquery-ui-1.8.17.custom.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#date1').datepicker();

$('#date1').focus(function(){
    $('#date1').datepicker('show');
});

$('#date1').click(function(){
    $('#date1').datepicker('show');
});
//$('#ui-datepicker-div').show();
$('#date1').datepicker('show');
});
</script>
</head>
<body>
<input type="text" name="date1" id='date1'>
</body>
</html>
    Merci, je suppose que l'ouverture de la datepicker au démarrage ne font sens et il n'résoudre une partie du problème. Ça ne résout pas le problème de la ré-ouvrir le datepicker en cliquant sur le champ après avoir appuyé sur la touche Esc, mais je ferais mieux de prendre à la résolution des bogues réels au lieu de jouer avec des questions triviales 🙂
    J'ai mis à jour le code. Check it out copain
    Merci Copain pour les réponses, j'ai été frapper ma tête de dernier 3 jours
    Je ne sais pas exactement ce que votre utilisation est, mais envisager d'utiliser Bootstrap sélecteur de date maintenant, et veiller à ce que ne soit pas en conflit avec jquery ui datepicker.

    OriginalL'auteur Rajan Rawal

  2. 2

    Ce problème ne répondrai pas à votre question, mais peut être un travail autour de, si votre problème de ne pas avoir le bouton sélecteur de date, est lié à avoir le sélecteur de date de bouton... si cela a un sens?

    J'ai eu un problème dont je ne veux pas avoir le bouton parce que des utilisateurs de tabulation par le biais de mon formulaire/page, et je ne voulais pas le bouton pour avoir le focus. (Bizarre expérience d'INTERFACE utilisateur)

    Si c'est votre cas... vous pouvez toujours supprimer son attention en faisant ce qui suit.. (Ça va aussi, indirectement, à résoudre le problème que vous rencontrez aujourd'hui.)

    $('#field').datepicker({
      showOn: 'button',
      buttonImage: "/image_path/image.png",
 }).next('img.ui-datepicker-trigger').attr('tabIndex', "-1");
    Merci c'est intelligent. En fait la raison pour laquelle je ne veux pas que le bouton est pour des raisons de cohérence. Dans mon application j'ai aussi un jqGrid avec date de colonnes, où un bouton moche et prendrait précieux largeur de l'écran, donc je veux que mon champs date de la grille est similaire à celui des champs à l'intérieur de la grille. Je suis upvoting votre réponse.

    OriginalL'auteur Rohan Büchner

  3. 1

    J'ai eu un scénario similaire: Premier champ sur la page une il devrait charges fermé, sans le bouton, et sera ouvert uniquement sur le clic de l'utilisateur. Mais il était fermé la "barre de recherche", afin de modifier le comportement par défaut n'est pas une option. Voici ma solution:

    $(document).ready(function () {
        //getting the controls on the form context
        var calendarios = $('.calendarBox', "#frmOccurrencesHistory");
        //set an invalid option - avoid open on focus and show the buttons
        calendarios.datepicker("option", "showOn", "click");
        //handle click button
        calendarios.each(function () {
            $(this).click(function () {
                $(this).datepicker('show');
            });
        });
    });

    Pas assez, pas parfait, il y a un flash du calendrier lorsque le chargement des pages, mais c'est à quel point je suis venu

    OriginalL'auteur Alexandre

  4. 0
     $("#datepicker").datepicker({
   dateFormat:'dd/M/yy',
   minDate: 'now',
   changeMonth:true,
   changeYear:true,
   showOn: "focus",
   //buttonImage: "YourImage",
   buttonImageOnly: true, 
   yearRange: "-100:+0",  
}); 

  $( "datepicker" ).datepicker( "option", "disabled", true );

    OriginalL'auteur Girish