<input type="datetime-local">

Gli elementi <input> di tipo datetime-local creano controlli di input che consentono all'utente di inserire facilmente sia una data che un'ora, inclusi anno, mese e giorno, nonché l'ora in ore e minuti.

L'interfaccia utente del controllo varia in generale da browser a browser. Nei browser senza supporto, questi degradano con grazia a semplici controlli <input type="text">.

Il controllo ha lo scopo di rappresentare una data e un'ora locali , non necessariamente la data e l'ora locali dell'utente . In altre parole, un'implementazione dovrebbe consentire qualsiasi combinazione valida di anno, mese, giorno, ora e minuto, anche se tale combinazione non è valida nel fuso orario locale dell'utente (come le ore all'interno di un divario di transizione primaverile-avanti dell'ora legale ). Alcuni browser mobili (in particolare su iOS) attualmente non lo implementano correttamente.

A causa del supporto limitato del browser di datetime-local e delle variazioni nel modo in cui funzionano gli input, attualmente potrebbe essere ancora meglio utilizzare un framework o una libreria per presentarli o utilizzare un input personalizzato. Un'altra opzione consiste nell'usare input separati datee , ognuno dei quali è più ampiamente supportato di timedatetime-local.

Alcuni browser potrebbero ricorrere a un elemento di input di solo testo che convalida che i risultati siano valori di data/ora legittimi prima di consentirne la consegna anche al server, ma non dovresti fare affidamento su questo comportamento poiché non puoi prevederlo facilmente esso.

Gli attributi di questo elemento includono gli attributi globali.

Valore

Una stringa che rappresenta il valore della data immessa nell'input.

Puoi impostare un valore predefinito per l'input includendo una data e un'ora all'interno dell'attributo value, in questo modo:

<label for="party">Inserisci data e ora del tuo party:</label>
<input id="party" type="datetime-local" name="partydate" value="2017-06-
01T08:30">

Una cosa da notare è che i formati di data e ora visualizzati differiscono da quelli effettivi value; la data e l'ora visualizzate sono formattate in base alla localizzazione dell'utente come riportato dal suo sistema operativo, mentre la data/ora è sempre formattata YYYY-MM-DDThh:mm. Quando il valore di cui sopra inviato al server, ad esempio, apparirà come partydate=2017-06-01T08:30.

Attributi aggiuntivi

Oltre agli attributi comuni a tutti gli elementi <input>, gli input datetime-local offrono i seguenti attributi.

max

L'ultima data e ora per accettare. Se il valore di value immesso nell'elemento è successivo a questo timestamp, l'elemento non supera la convalida del vincolo. Se il valore dell'attributo max non è una stringa valida che segue il formato YYYY-MM-DDThh:mm, l'elemento non ha un valore massimo.

Questo valore deve specificare una stringa di data successiva o uguale a quella specificata dall'attributo min.

min

La prima data e ora per accettare; timestamp precedenti a questo faranno sì che l'elemento non superi la convalida del vincolo. Se il valore dell'attributo min non è una stringa valida che segue il formato YYYY-MM-DDThh:mm, l'elemento non ha un valore minimo.

Questo valore deve specificare una stringa di data precedente o uguale a quella specificata dall'attributo max.

step

L'attributo step è un numero che specifica la granularità a cui deve attenersi il valore o il valore speciale any, descritto di seguito. Sono validi solo i valori che sono uguali alla base per il passaggio ( min se specificato, value altrimenti, e un valore predefinito appropriato se nessuno di questi è fornito).

Un valore stringa di any significa che non è implicito alcun passaggio e qualsiasi valore è consentito (salvo altri vincoli, come min e max).

Per gli input datetime-local, il valore di stepè espresso in secondi, con un fattore di scala pari a 1000 (poiché il valore numerico sottostante è in millisecondi). Il valore predefinito di step è 60, che indica 60 secondi (o 1 minuto o 60.000 millisecondi).

Al momento, non è chiaro per cosa anysignifichi un valore di stepquando utilizzato con datetime-localgli input. Questo verrà aggiornato non appena tali informazioni saranno determinate.

Liste utili