Tag input

Il tag input crea vari elementi del modulo HTML: campo di inserimento normale, campo per l'inserimento della password, casella di controllo checkbox, pulsanti radio (radio), pulsante.

Il tag input deve trovarsi all'interno del tag form. Non è obbligatorio, ma è necessario per l'invio dei dati al server e la loro successiva elaborazione tramite PHP.

Non richiede un tag di chiusura.

Attributi

Attributo	Descrizione
type	Imposta il tipo di campo di inserimento. Le opzioni sono riportate di seguito.
value	Valore predefinito nel campo di inserimento. Nel caso di un pulsante, ne imposta il testo. Per maggiori dettagli, vedi l'attributo value.
placeholder	Suggerimento nel campo di inserimento, per maggiori dettagli vedi l'attributo placeholder.
name	Nome del campo di inserimento. Necessario per recuperare i dati del campo di inserimento in PHP. Per il corretto funzionamento del modulo, i nomi dei campi di inserimento non devono coincidere tra loro (in uno stesso modulo). Se coincidono - in PHP arriveranno i dati del campo di inserimento che si trova più in basso nel codice HTML.
disabled	Blocca l'elemento del modulo (non solo input, ma praticamente qualsiasi), per maggiori dettagli vedi l'attributo disabled.

Valori dell'attributo type

Valore	Descrizione
text	Crea un normale campo di inserimento testuale.
password	Crea un campo di inserimento testuale per la password. Provate a digitare del testo - verrà visualizzato con degli asterischi.
checkbox	Crea una casella di controllo checkbox. Per maggiori dettagli, vedi checkbox.
radio	Crea un pulsante di opzione radio. Per maggiori dettagli, vedi radio.
hidden	Crea un input nascosto, che non sarà visibile sullo schermo, ma invierà i dati contenuti nell'attributo value al server.
button	Crea un pulsante. La pressione di questo pulsante non invierà il modulo al server. Può essere utilizzato all'interno di un link o tramite JavaScript. Per impostazione predefinita il pulsante non ha testo (esempio di pulsante senza testo: ), esso viene impostato tramite value. Vedi anche il tag button, che crea anch'esso un pulsante.
submit	Crea un pulsante che invierà i dati al server. Il testo del pulsante dipende dal browser, può essere cambiato tramite value. Vedi anche il tag button, che crea anch'esso un pulsante.
reset	Crea un pulsante che cancella il modulo compilato. Il testo del pulsante dipende dal browser, può essere cambiato tramite value.
file	Crea un pulsante per la selezione del file. È vietato modificare il design di questo pulsante tramite CSS (tuttavia esistono metodi ingegnosi). Se avete bisogno di un tale campo in un modulo, allora il tag form deve avere l'attributo enctype con valore multipart/form-data.

Nuovi valori per l'attributo type in HTML5

Questi valori dell'attributo sono nuovi, sono apparsi solo in HTML5, quindi in alcuni browser potrebbero non funzionare o funzionare in modo diverso in browser diversi.

Nel caso in cui il browser non possa comprendere il contenuto dell'attributo type (ad esempio, se non è supportato o digitato erroneamente), considererà l'elemento come un normale input testuale, come se in type ci fosse il valore text.

Provate gli esempi seguenti in diversi browser. Provate a inserire negli input del testo e a premere il pulsante di invio. Se il testo non è corretto o il campo è vuoto - il browser mostrerà un errore. Ad esempio, se in un campo con tipo email si inserisce un'email non corretta - il browser non permetterà di inviare il modulo e mostrerà un messaggio di errore (il testo dell'errore e il suo aspetto non possono essere modificati tramite html css). Se il campo è vuoto - il browser mostrerà comunque un errore, ciò è ottenuto tramite l'attributo required:

Valore	Descrizione
email
number
url
tel
search
color
date
month
week
datetime
datetime-local
range

Vedi anche