Selettore data / ora jQuery [chiuso]

Ho cercato un decente plug-in jQuery in grado di gestire sia le date che gli orari. L'interfaccia utente di base DatePickerè fantastica, ma sfortunatamente devo anche essere in grado di prendere tempo.

Ho trovato alcuni hack per il funzionamento di DatePicker con i tempi, ma sembrano tutti piuttosto ineleganti e Google non sta ottenendo nulla di carino.

Esiste un buon plug-in jQuery per la selezione di date e orari in un singolo controllo dell'interfaccia utente con un'interfaccia utilizzabile?

L'opzione di selezione DateTime di gran lunga più semplice e semplice è http://trentrichardson.com/examples/timepicker/ .

È un'estensione dell'interfaccia utente di jQuery Datepicker, quindi supporterà gli stessi temi e funziona in modo molto simile, sintassi simile, ecc. Questo dovrebbe essere impacchettato con l'interfaccia utente di jQuery imo.

@ David, grazie per la raccomandazione! @fluid_chelsea, ho appena rilasciato Any + Time (TM) versione 3.x che utilizza jQuery invece di Prototype e ha un'interfaccia molto migliorata, quindi spero che ora soddisfi le tue esigenze:

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

Eventuali problemi, per favore fatemi sapere tramite il link dei commenti sul mio sito Web!

A mio avviso, le date e gli orari dovrebbero essere gestiti come due caselle di input separate affinché siano più utilizzabili ed efficienti per l'input dell'utente. Lasciare che l'utente inserisca una cosa alla volta è un buon principio, imho.

Uso l' interfaccia utente principale DatePicker e il seguente selettore del tempo.

Questo è ispirato a quello utilizzato da Google Calendar:

jQuery timePicker :
esempi: http://labs.perifer.se/timedatepicker/
project su github: https://github.com/perifer/timePicker

Ho trovato il migliore tra tutte le alternative. L'utente può inserire rapidamente, sembra pulito, è semplice e consente all'utente di inserire tempi specifici fino al minuto.

PS: Dal mio punto di vista: i cursori (usati da alcuni selettori di tempo alternativi) prendono troppi clic e richiedono la precisione del mouse dall'utente (il che rende l'input più lento).

La mia migliore esperienza con un datepicker è con AnyTime basato su prototipo . So che non è jQuery, ma potrebbe comunque valere la pena per te. Non conosco assolutamente alcun prototipo ed è ancora abbastanza facile da lavorare.

Un avvertimento che ho trovato: non è compatibile in avanti su alcuni browser. Cioè, non ha funzionato con una versione più recente del prototipo su Chrome.

Solo per aggiungere alle informazioni qui, The Fluid Project ha un bel wiki-up che mostra un gran numero di selettori di data e / o ora qui .

Ho studiato questo di recente e non ho ancora trovato un selettore di date decente che includa anche un selettore di tempo decente . Quello che ho finito per usare era il fantastico DatePicker di eyecon , con due semplici menu a discesa per il tempo. Sono stato tentato di usare Timepickr.js , sembra un approccio davvero carino.

Ho riscontrato lo stesso problema. In realtà ho sviluppato il mio utilizzo della programmazione lato server, ma ho fatto una ricerca veloce per provare ad aiutarti e ho trovato questo.

Va bene, non ha guardato troppo alla fonte, ma sembra essere puramente JavaScript.

Dai un'occhiata:

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

Ecco il link alla pagina demo:

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

in bocca al lupo

Questo è un codice che uso per consentire a un utente di selezionare un datetimepicker, impostare il datetime e fare in modo che l'altro datetimepicker aggiunga un minuto a quell'ora.

Ne avevo bisogno per un controllo terapeutico personalizzato ...

Comunque, ho pensato che potesse aiutare qualcun altro dato che non sono riuscito a trovare la risposta in nessun posto online ...

(almeno non una risposta completa)

Tieni presente che il 60000 ha aggiunto, aggiunge un minuto. (60 * 1000 millisecondi)

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

Dai un'occhiata al seguente plug-in JavaScript.

Calendario Javascript con data e ora

L'ho reso il più semplice possibile. ma è ancora ai suoi inizi. Fammi sapere il feedback in modo da poterlo migliorare.

Non jQuery, ma funziona bene per un calendario con l'ora: Selettore data e ora JavaScript .

Ho appena associato l'evento click per farlo apparire:

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

Faccio una funzione in questo modo:

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

Quindi uso il datepicker dell'interfaccia utente jQuery in questo modo:

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

Quindi, ottengo il valore in questo modo: 2010-10-31 12:41:57

Abbiamo avuto difficoltà a trovarne uno che funzionava come volevamo, quindi ne ho scritto uno. Conservo l'origine e correggo i bug man mano che si presentano, oltre a fornire supporto gratuito.

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