jQuery Datums- / Zeitauswahl [geschlossen]

Ich habe mich nach einem anständigen jQuery-Plugin umgesehen, das sowohl Datum als auch Uhrzeit verarbeiten kann. Die Kern-Benutzeroberfläche DatePickerist großartig, aber leider muss ich mir auch Zeit nehmen können.

Ich habe ein paar Hacks gefunden, mit denen der DatePicker mit der Zeit arbeiten kann, aber alle scheinen ziemlich unelegant zu sein, und Google zeigt nichts Nettes.

Gibt es ein gutes jQuery-Plugin zum Auswählen von Datum und Uhrzeit in einem einzelnen UI-Steuerelement mit einer verwendbaren Oberfläche?

Die mit Abstand schönste und einfachste DateTime-Auswahloption ist http://trentrichardson.com/examples/timepicker/ .

Es ist eine Erweiterung des jQuery UI Datepicker, sodass es dieselben Themen unterstützt und auf die gleiche Weise funktioniert, ähnliche Syntax usw. Dies sollte mit dem jQuery UI imo gepackt werden.

@ David, danke für die Empfehlung! @fluid_chelsea, ich habe gerade Any + Time (TM) Version 3.x veröffentlicht, die jQuery anstelle von Prototype verwendet und eine stark verbesserte Benutzeroberfläche hat. Ich hoffe, dass es jetzt Ihren Anforderungen entspricht:

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

Bei Problemen teilen Sie mir dies bitte über den Kommentar-Link auf meiner Website mit!

Meiner Ansicht nach sollten Datum und Uhrzeit als zwei separate Eingabefelder behandelt werden, damit der Benutzer sie am besten verwenden und effizient eingeben kann. Lassen Sie den Benutzer eine Sache nach der anderen eingeben, ist ein gutes Prinzip, imho.

Ich verwende den Core UI DatePicker und die folgende Zeitauswahl .

Dieser ist inspiriert von dem, den Google Kalender verwendet:

jQuery timePicker :
Beispiele: http://labs.perifer.se/timedatepicker/
Projekt auf Github: https://github.com/perifer/timePicker

Ich fand es die beste unter allen Alternativen. Der Benutzer kann schnell eingeben, es sieht sauber aus, ist einfach und ermöglicht es dem Benutzer, bestimmte Zeiten minutengenau einzugeben.

PS: Meiner Ansicht nach: Schieberegler (die von einigen alternativen Zeitwählern verwendet werden) erfordern zu viele Klicks und erfordern vom Benutzer Mausgenauigkeit (was die Eingabe verlangsamt).

Meine beste Erfahrung mit einem Datepicker mache ich mit dem prototypbasierten AnyTime . Ich weiß, dass dies nicht jQuery ist, aber es kann den Kompromiss für Sie wert sein. Ich kenne absolut keinen Prototyp und es ist immer noch einfach genug, damit zu arbeiten.

Eine Einschränkung, die ich gefunden habe: Es ist in einigen Browsern nicht vorwärtskompatibel. Das heißt, es funktionierte nicht mit einer neueren Version des Prototyps auf Chrome.

Um die Informationen hier zu ergänzen, hat The Fluid Project eine nette Wiki-Zusammenfassung, die eine große Anzahl von Datums- und / oder Zeitwählern hier zusammenfasst .

Ich habe dies erst kürzlich recherchiert und noch keinen anständigen Datums-Picker gefunden, der auch einen anständigen Zeit-Picker enthält. Am Ende habe ich den fantastischen DatePicker von eyecon verwendet , mit zwei einfachen Dropdowns für die Zeit. Ich war versucht, Timepickr.js zu verwenden , sieht aber nach einem wirklich guten Ansatz aus.

Ich bin auf dasselbe Problem gestoßen. Ich habe meine Verwendung der serverseitigen Programmierung entwickelt, aber ich habe eine schnelle Suche durchgeführt, um Ihnen zu helfen, und dies gefunden.

Scheint in Ordnung zu sein, hat nicht zu viel auf die Quelle geschaut, scheint aber nur JavaScript zu sein.

Schauen Sie:

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

Hier ist der Link zur Demoseite:

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

Viel Glück

Dies ist ein Code, den ich verwende, damit ein Benutzer einen DatetimePicker auswählt, die Datetime festlegt und der andere DatetimePicker dieser Zeit eine Minute hinzufügt.

Ich brauchte dies für eine benutzerdefinierte Medikamentenkontrolle ....

Wie auch immer, dachte, es könnte jemand anderem helfen, da ich die Antwort nirgendwo online finden konnte ...

(zumindest keine vollständige Antwort)

Denken Sie daran, dass der 60000 hinzugefügt wird, fügt eine Minute hinzu. (60 * 1000 Millisekunden)

$('.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()));
        }
    });

Schauen Sie sich das folgende JavaScript-Plugin an.

Javascript Kalender mit Datum und Uhrzeit

Ich habe es so einfach wie möglich gemacht. aber es ist noch in den frühen Tagen. Lassen Sie mich das Feedback wissen, damit ich es verbessern kann.

Nicht jQuery, aber es funktioniert gut für einen Kalender mit Zeit: JavaScript Date Time Picker .

Ich habe gerade das Klickereignis gebunden, um es zu öffnen:

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

Ich mache eine Funktion wie diese:

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;
}

Dann benutze ich den jQuery UI Datepicker wie folgt:

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

Ich erhalte also den folgenden Wert: 2010-10-31 12:41:57

Wir hatten Probleme, eine zu finden, die so funktionierte, wie wir es wollten, also schrieb ich eine. Ich pflege die Quelle und behebe auftretende Fehler und biete kostenlosen Support.

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