Corsi on-line

Datedropper, un datapicker con jQuery

Datedropper è una soluzione Open Source per l’integrazione di datapicker all’interno di un sito Internet o di una Web application; si tratta di un comodo plugin per il framework JavaScript jQuery che potrà essere utilizzato nei form per i feedback così come nei moduli per le prenotazioni, a caratterizzare questa estensione è in particolare una procedura d’installazione estremamente semplice e la grande disponibilità di opzioni per la configurazione.

CatturaDopo aver scaricato il necessario package e richiamato jQuery (possibilmente via CDN) all’interno della pagina nella quale si desidera utilizzare lo script, si potrà procedere con l’inclusione del file JavaScript del plugin (datedropper.js) e del foglio di stile per la formattazione del datapicker (datedropper.css):

<script src="js/datedropper.js"></script>
<link rel="stylesheet" type="text/css" href="js/datedropper.css">

Fatto questo si potrà integrare l’interfaccia per la selezione della data in qualsiasi punto della pagina lo si voglia adottare, ciò sarà possibile tramite un semplice campo di input testuale al quale associare l’identificatore departure:

<input type="text" id="departure" />

Il terzo e ultimo passaggio prevede di inserire alla fine del body un riferimento all’identificatore da associare al metodo dateDropper() che consentirà il funzionamento del datapicker e l’interazione con esso:

<script>$( "#departure" ).dateDropper();</script>

Sarà possibile configurare qualsiasi aspetto dell’interfaccia e dei parametri manipolati attraverso di essa; sono supportate le animazioni (predefinita fadeIn(), ma è possibile definire anche bounce() e dropDown()), la formattazione della data così come la lingua di riferimento (Inglese di default).

L’utilizzatore potrà stabilire anche un anno iniziale a partire dal quale effettuare la selezione della data e un intervallo di date per delimitare la scelta tra due anni specifici.

Via Datedropper

Post correlati
I più letti del mese
Tematiche