Non c’è form che si rispetti senza bottone di invio.
La sintassi tradizionale per creare un bottone di invio è:
<input type="submit" value="invia I dati">
Ad esempio:
<form action=http://www.html.it
target="_blank">
<input type="submit"
value="visita HTML.it">
</form>
cioè:
Un altro bottone utile è il "reset" che – una volta premuto
- consente di riportare il form allo stato originario, cancellando ogni cosa
scritta finora dall’utente. Ecco un esempio:
<form>
<input
type="text"><br>
<input type="reset"
value="cancella">
</form>
cioè
Esiste infine un tipo di bottone generico, che non esegue nessuna azione
particolare, ma che può essere ad esempio utilizzato per associare degli eventi
tramite JavaScript.
<form>
<input type="button"
value="bottone generico">
</form>
che dà:
Il tag <button>
Con l’HTML 4 è stato introdotto il tag <button> che
offre la possibilità di creare dei bottoni con un aspetto particolarmente
ricco.
Il tag <button>, a differenza del tag
<input>, dà la possibilità di inserire il testo del
bottone tra l’apertura e la chiusura del tag medesimo. Questo ci consente di
specificare anche del codice HTML all’interno del tag.
I bottoni che abbiamo appena visto dovrebbero dunque avere questa forma:
<form action=http://www.html.it
target="_blank">
<input
type="text"><br>
<button
type="button">
bottone
generico
</button>
<button
type="reset">
cancella
</button>
<button
type="submit">
invia
</button>
</form>
cioè:
Ed ecco un esempio complesso:
<button name="vai"
type="submit">
invia
<img src="puntoEsclamativo.gif" width="23" height="67" title="invia adesso"
border="1" vspace="5" alt="invia adesso"
align="middle">
<b>adesso</b>
</button>
che dà:
Grazie all’attributo "disable" è infine possibile
disabilitare i bottoni.
Es:
<input type="submit" value="invia" disabled>
o anche:
<button type="submit"
disabled>
invia
</button>
cioè:
Il campo image
Il campo "image" ci consente di utilizzare come bottoni del
form delle vere e proprie immagini e assegnare loro un valore grazie a
JavaScript; in questo caso non si tratta propriamente di un bottone ma la
funzionalità è la medesima. Ecco il codice:
<input name="invia" type="image" src="invia.gif" alt="invia
il modulo" title="invia il modulo" width="78" height="38">
cioè:
come si può vedere, se non si specifica nulla, l’immagine ha valore di
submit.
Gli attributi del campo immagine sono molto simili a quelli del tag
<img>.