jQuery date / time picker [fermé]

J'ai cherché un plugin jQuery décent qui peut gérer à la fois les dates et les heures. L'interface utilisateur principale DatePickerest géniale, mais malheureusement, je dois également pouvoir y consacrer du temps.

J'ai trouvé quelques hacks pour que le DatePicker fonctionne avec le temps, mais ils semblent tous assez inélégants et Google ne présente rien de bien.

Existe-t-il un bon plugin jQuery pour sélectionner les dates et heures dans un seul contrôle d'interface utilisateur avec une interface utilisable?

L'option de sélection DateTime la plus agréable et la plus simple est de loin http://trentrichardson.com/examples/timepicker/ .

Il s'agit d'une extension du jQuery UI Datepicker donc il prendra en charge les mêmes thèmes et il fonctionne à peu près de la même manière, une syntaxe similaire, etc. Cela devrait être fourni avec l'imo jQuery UI.

@David, merci pour la recommandation! @fluid_chelsea, je viens de publier Any + Time (TM) version 3.x qui utilise jQuery au lieu de Prototype et a une interface très améliorée, donc j'espère qu'il répond maintenant à vos besoins:

http://www.ama3.com/anytime/

En cas de problème, faites-le moi savoir via le lien commentaire sur mon site!

À mon avis, les dates et les heures doivent être traitées comme deux zones de saisie distinctes pour être plus utilisables et efficaces pour l'utilisateur à saisir. Laisser l'utilisateur saisir une chose à la fois est un bon principe, à mon humble avis.

J'utilise le noyau UI DatePicker et le sélecteur de temps suivant.

Celui-ci est inspiré de celui utilisé par Google Agenda:

jQuery timePicker :
exemples: http://labs.perifer.se/timedatepicker/
projet sur github: https://github.com/perifer/timePicker

J'ai trouvé que c'était la meilleure parmi toutes les alternatives. L'utilisateur peut saisir rapidement, il a l'air propre, est simple et permet à l'utilisateur de saisir des heures spécifiques à la minute près.

PS: À mon avis: les curseurs (utilisés par certains sélecteurs de temps alternatifs) prennent trop de clics et nécessitent la précision de la souris de l'utilisateur (ce qui rend la saisie plus lente).

Ma meilleure expérience avec un sélecteur de date est avec AnyTime basé sur un prototype . Je sais que ce n'est pas jQuery, mais cela vaut peut-être toujours le compromis pour vous. Je ne connais absolument aucun prototype, et c'est toujours assez facile à utiliser.

Une mise en garde que j'ai trouvée: il n'est pas compatible avec certains navigateurs. Autrement dit, cela ne fonctionnait pas avec une version plus récente du prototype sur Chrome.

Juste pour ajouter aux informations ici, The Fluid Project a une belle rédaction wiki qui présente un grand nombre de sélecteurs de date et / ou d'heure ici .

J'ai fait des recherches récemment et je n'ai pas encore trouvé de sélecteur de date décent qui comprend également un sélecteur de temps décent . Ce que j'ai fini par utiliser était l'impressionnant DatePicker d'Eyecon , avec deux listes déroulantes simples pour le temps. J'ai été tenté d'utiliser Timepickr.js cependant, cela ressemble à une approche vraiment sympa.

J'ai rencontré ce même problème. En fait, j'ai développé ma programmation côté serveur, mais j'ai fait une recherche rapide pour essayer de vous aider et j'ai trouvé cela.

Semble bien, n'a pas trop regardé la source, mais semble être purement JavaScript.

Regardez:

http://www.rainforestnet.com/datetimepicker/datetimepicker.htm

Voici le lien vers la page de démonstration:

http://www.rainforestnet.com/datetimepicker/datetimepicker-demo.htm

bonne chance

Il s'agit d'un code que j'utilise pour qu'un utilisateur sélectionne un datetimepicker, règle l'heure et que l'autre datetimepicker ajoute une minute à cette heure.

J'en avais besoin pour un contrôle médicamenteux personnalisé ....

Quoi qu'il en soit, j'ai pensé que cela pourrait aider quelqu'un d'autre car je ne pouvais trouver la réponse nulle part en ligne ...

(du moins pas une réponse complète)

Gardez à l'esprit que le 60000 ajouté, ajoute une minute. (60 * 1000 millisecondes)

$('.frdtPicker').datetimepicker({
        onClose: function(dateText, inst) {
            var endDateTextBox = $('.todtPicker');
            if (endDateTextBox.val() != '') {
                var testStartDate = new Date(dateText);
                var testEndDate = new Date(endDateTextBox.val());
                if (testStartDate > testEndDate) {

                    var testStartDate = new Date(dateText).getTime() + 60000;
                    var testStartDate2 = new Date(testStartDate); 

                    endDateTextBox.datetimepicker('setDate', (new Date(testStartDate2)));
                }
            }
            else {
                var testStartDate = new Date(dateText).getTime() + 60000;
                var testStartDate2 = new Date(testStartDate);
                endDateTextBox.datetimepicker('setDate', (new Date(testStartDate2)));
            }
            $('.frdtPicker').val(dateText); //endDateTextBox.val());

        },
        onSelect: function(selectedDateTime) {
            var start = $(this).datetimepicker('getDate');
            $('.todtPicker').datetimepicker('option', 'minDate', new Date(start.getTime()));
        }
    });

Jetez un œil au plugin JavaScript suivant.

Calendrier Javascript avec date et heure

Je l'ai fait pour être aussi simple que possible. mais il en était encore à ses débuts. Faites-moi savoir les commentaires afin que je puisse l'améliorer.

Pas jQuery, mais cela fonctionne bien pour un calendrier avec le temps: sélecteur de date et heure JavaScript .

Je viens de lier l'événement click pour le faire apparaître:

$(".arrival-date").click(function() {
    NewCssCal($(this).attr('id'), 'mmddyyyy', 'dropdown', true, 12);
});

Je fais une fonction comme celle-ci:

function getTime()
{
    var date_obj = new Date();
    var date_obj_hours = date_obj.getHours();
    var date_obj_mins = date_obj.getMinutes();
    var date_obj_second = date_obj.getSeconds();

    var date_obj_time = "'"+date_obj_hours+":"+date_obj_mins+":"+date_obj_second+"'";
    return date_obj_time;
}

Ensuite, j'utilise le sélecteur de date jQuery UI comme ceci:

$("#selector").datepicker( "option", "dateFormat", "yy-mm-dd "+getTime()+"" );

Donc, j'obtiens la valeur comme ceci: 2010-10-31 12:41:57

Nous avons eu du mal à en trouver un qui fonctionnait comme nous le voulions, alors j'en ai écrit un. Je maintiens la source et corrige les bugs au fur et à mesure qu'ils surviennent, et je propose une assistance gratuite.

http://www.yart.com.au/Resources/Programming/ASP-NET-JQuery-Date-Time-Control.aspx