HTML
Le forme
Ricerca…
introduzione
Per raggruppare elementi di input e inviare dati, HTML utilizza un elemento modulo per incapsulare gli elementi di input e di invio. Queste forme gestiscono l'invio dei dati nel metodo specificato a una pagina gestita da un server o gestore. Questo argomento spiega e dimostra l'utilizzo di moduli HTML nella raccolta e nell'invio di dati di input.
Sintassi
<form method="post|get" action="somePage.php" target="_blank|_self|_parent|_top|framename">
Parametri
Attributo | Descrizione |
---|---|
accept-charset | Specifica le codifiche dei caratteri che devono essere utilizzate per l'invio del modulo. |
action | Specifica dove inviare i dati del modulo quando viene inviato un modulo. |
autocomplete | Specifica se un modulo deve avere il completamento automatico attivato o disattivato. |
enctype | Specifica come devono essere codificati i dati del modulo quando lo si invia al server (solo per method = "post"). |
method | Specifica il metodo HTTP da utilizzare quando si inviano i dati del modulo (POST o GET). |
name | Specifica il nome di un modulo. |
novalidate | Specifica che il modulo non deve essere convalidato quando inviato. |
target | Specifica dove visualizzare la risposta ricevuta dopo aver inviato il modulo. |
Osservazioni
L'elemento <form>
rappresenta una sezione che contiene elementi associati al modulo (ad esempio <button>
<fieldset>
<input>
<label>
<output>
<select>
<textarea>
) che invia informazioni a un server. Sono necessari entrambi i <form>
inizio ( <form>
) e finale ( </form>
).
Invio
L'attributo di azione
L'attributo action definisce l'azione da eseguire quando viene inviato il modulo, che di solito conduce a uno script che raccoglie le informazioni inviate e funziona con esso. se lo lasci vuoto, lo invierà allo stesso file
<form action="action.php">
L'attributo del metodo
L'attributo method viene utilizzato per definire il metodo HTTP del modulo che è GET o POST.
<form action="action.php" method="get">
<form action="action.php" method="post">
Il metodo GET è principalmente utilizzato per ottenere dati, ad esempio per ricevere un post tramite il suo ID o nome, o per inviare una query di ricerca. Il metodo GET aggiungerà i dati del modulo all'URL specificato nell'attributo action.
www.example.com/action.php?firstname=Mickey&lastname=Mouse
Il metodo POST viene utilizzato quando si inviano dati a uno script. Il metodo POST non aggiunge i dati del modulo all'URL dell'azione ma invia utilizzando il corpo della richiesta.
Per inviare correttamente i dati dal modulo, è necessario specificare un nome di attributo nome.
Ad esempio, inviamo il valore del campo e impostiamo il suo nome sul cognome :
<input type="text" name="lastname" value="Mouse">
Più attributi
<form action="action.php" method="post" target="_blank" accept-charset="UTF-8"
enctype="application/x-www-form-urlencoded" autocomplete="off" novalidate>
<!-- form elements -->
</form>
Attributo di destinazione nel tag modulo
L'attributo target specifica un nome o una parola chiave che indica dove visualizzare la risposta ricevuta dopo aver inviato il modulo.
L'attributo target definisce un nome o una parola chiave per un contesto di esplorazione (ad esempio tab, finestra o frame incorporato).
Da tag con un attributo target:
<form target="_blank">
Valori di attributo
Valore | Descrizione |
---|---|
_blank | La risposta viene visualizzata in una nuova finestra o scheda |
_se stesso | La risposta viene visualizzata nello stesso frame (questa è l'impostazione predefinita) |
_genitore | La risposta è visualizzata nel frame principale |
_superiore | La risposta viene visualizzata nel corpo completo della finestra |
framename | La risposta viene visualizzata in un iframe con nome |
Nota: l'attributo target è stato deprecato in HTML 4.01 . L'attributo target è supportato in HTML5 .
I frame e i set di frame non sono supportati in HTML5 , quindi i valori _parent, _top e framename vengono ora utilizzati principalmente con iframe .
Caricamento di file
Immagini e file possono essere caricati / inviati al server impostando enctype
attributo enctype
del tag form
su multipart/form-data
. enctype
specifica come i dati del modulo verrebbero codificati durante l'invio al server.
Esempio
<form method="post" enctype="multipart/form-data" action="upload.php">
<input type="file" name="pic" />
<input type="submit" value="Upload" />
</form>
Raggruppamento di alcuni campi di input
Durante la progettazione di un modulo, è possibile raggruppare alcuni campi di input in un gruppo per organizzare il layout del modulo. Questo può essere fatto usando il tag. Ecco un esempio per utilizzarlo.
Per ogni fieldset, puoi impostare una legenda per il set usando il tag LEGEND TEXT
Esempio
<form>
<fieldset>
<legend>1st field set:</legend>
Field one:<br>
<input type="text"><br>
Field two:<br>
<input type="text"><br>
</fieldset><br>
<fieldset>
<legend>2nd field set:</legend>
Field three:<br>
<input type="text"><br>
Field four:<br>
<input type="text"><br>
</fieldset><br>
<input type="submit" value="Submit">
</form>
Risultato
Supporto del browser
Chrome, IE, Edge, FireFox, Safari e le ultime versioni di Opera supportano anche il tag