Unobtrusive Date-Picker Widget V4

datapickerPer chi avesse bisogno di un datapicker in javascript posso consigliarvi questo che è a dir poco eccezionale. Di seguito alcune delle pricipali caratteristiche:

  • Accessibilità tramite tastiera
  • Gestione dei più disparati formati data
  • Unobtrusive javascript (neanche una linea di javascript da inserire nel codice html)
  • Gestione degli skin css
  • Gestione della selezione di intervalli di date
  • Possibilità di disabilitare alcuni giorni della settimana
  • Localizzazione
  • Possibilità di evidenziare alcuni giorni della settimana

L’inclusione del datapicker dentro la pagina html avviene inserendo l’apposito javascript seguito da alcuni parametri di configurazione, nel mio caso ho indicato solo la localizzazione italiana:

<script src="common/date-picker-v4/js/datepicker.js" type="text/javascript">
{
"lang":"it",
}

Fatto questo basterà creare il campo di input di tipo text su cui vorremo fare inserire la data. La personalizzazione del datapicker avviene applicando al suddetto campo un apposita classe. Nel mio caso ho scelto di fare comparire la data nel formato gg/mm/aaaa grazie alla classe dateformat-d-sl-m-sl-Y.

<input type=text class="dateformat-d-sl-m-sl-Y" size=10 >

L’esempio sopra citato potete trovalo su Al Paradiso di Frassina – Agriturismo, mentre altre demo e istruzioni ai seguenti link del sito ufficiale:

www.frequency-decoder.com/2009/02/03/unobtrusive-date-picker-widget-v4

www.frequency-decoder.com/demo/date-picker-v4/

è anche possibile creare eventuali localizzazioni mancanti grazie al Language file creator, una volta inseriti tutti i termini il file creato deve essere inserito sotto la directory /js/lang a partire dalla root del pacchetto datapicker.

Questo è il file di localizzazione italiana da me creato: it.js

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *