Sliding Date Picker
Giovedì 24 Gennaio 2008 - 10:52
di Riccardo Degni
Questo plug-in ideato da Geoffrey McGill (sviluppatore della libreria DateJs) è un po’ diverso dai date picker a cui siamo abituati: si tratta di uno Sliding Date Picker.
In pratica, consiste in una barra orizzontale che rappresenta, in forma di “righello”, i giorni e i mesi, e due text input che rappresentano l’intervallo delle date.
La barra blu che si viene a creare può essere trascinata e alterata alla dimensione desiderata, che corrisponde ad una data precisa. Gli intervalli compariranno in tempo reale nei due text input. Inoltre, è possibile digitare due date direttamente nei campi di testo e lo slider si modificherà di conseguenza. Insomma, una variante interessante in termini di interfaccia utente per un tipo di interazione divenuto pressoché standard nella forma del date picker ‘classico’.
Nell’articolo viene spiegato molto bene come utilizzarlo nelle proprie applicazioni: si tratta di utilizzare due righe di Javascript e pochissimo codice HTML.
Ecco la demo dove è possibile sperimentare quanto detto. Ricordo infine che questa applicazione è realizzata con la libreria Prototype e la sua estensione Script.aculo.us.
Categoria: Scripting | Permalink
Commenti
1
che dire… fantastico!
2
Capita proprio a fagiolo! Anche se ho realizzato il sito tutto con JQuery, credo che su una pagina specifica mi tocchera` usare Prototype, ma ne varra` la pena
# - postato da Martin Sarsini - 24 Gennaio 2008 - 12:11
3
Perchè non lanciare un contest? Chi realizzerà la versione per JQuery o Ext 2? :)
4
Opinione controcorrente: francamente lo trovo davvero poco utilizzabile, soprattutto se si devono impostare date molto lontane nel tempo.
Alla fine io trovo molto piu’ veloce usare le normali select list.# - postato da Erich - 24 Gennaio 2008 - 15:42
5
Lo script è un po’ buggoso, cmq è la copia sputata del data picker di Google Analytics, non ci trovo nulla di originale.
# - postato da Slam - 24 Gennaio 2008 - 21:50
6
P.S.: sono 240kb solo di javascript -_-
# - postato da Slam - 24 Gennaio 2008 - 21:54
7
concordo con Slam… in effetti non è proprio il massimo… e poi, 240 kb di js, rivendicano le poche righe di codice html per utilizzarlo.
8
se cambio la data nei campi di testo devo tabbare perché la barra si aggiorni. se clicco invio invece , posto i dati.
Peccato. potenzialmente una bella soluzione senza questi 2 bugs (normali comportamenti del browser, solo inadatti qui). Tanto varrebbe una soluzione in Flash-AS con un livello accessibile.# - postato da Jan Tonellato - 16 Dicembre 2008 - 19:21