Image for Approfondimento tags Input relativi alle Date ed agli orari in HTML5 e CSS3 e su iPhone

Approfondimento tags Input relativi alle Date ed agli orari in HTML5 e CSS3 e su iPhone

Oggi approfondiremo il discorso sulle date relativo agli input type, nel caso ho esaminato la usabilità anche su iPhone e saranno di vero aiuto anche per chi sviluppa form per il web sul mobile.

Cominciamo dal tag Date, il quale può avere degli attributi di tipo min, max e step, ecco un esempio di codice nei rispettivi casi:

Esempio di codice per l’attributo Datetime e Datetime-local:

Se vogliamo far scegliere all’utente solo l’anno ed il mese questo è il codice giusto:

Grazie al tag Week potrete mostrare il numero della settimana, ecco il codice  giusto:

Se invece volete lavorare solo con le ore del giorno in formato 24 ore ecco il codice:

Considerazioni lato mobile

Ho testato personalmente ogni tag in esame ed ecco il risultato:

Input Date

input_date_iphone

Input Date min e max: non lavora bene sul mobile (non c’è validazione)

input_date_min_max_iphone

Input Date step: non lavora bene sul mobile (non c’è validazione)

input_date_step_iphone

Input Datetime

input_datetime_iphone

Input Datetime-local

input_datetime_local_iphone

Input Month

input_month_iphone

Input Week: non lavora bene sul mobile (non c’è validazione ed il campo non è corretto)

input_week_iphone

Input Time

input_time

Quindi, in conclusione, possiamo dire che alcuni attributi vanno usati con cautela se parliamo di dispositivi mobili. Tenetene conto quando sviluppate anche sotto questo aspetto!

Demo Anteprima

Download

Lascia un commento

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

Usando questo sito, accetti l’uso dei cookies.

Accetto