Come creare form e imput

~ Master Chief

Posted on 8/12/2008, 00:11

.

User deleted

Guida alla creazione di form e imput per i propri siti o per abbellire le vostre firme.

Tag imputIl tag input è un particolare tag (come quello delle immagini) che non richiede chiusura e sono dotati di attributi che indicano il nome,tipo e valore.
Per creare un bottone d'invio generico basta usare questo codice:

HTML

<input type="submit" value="Invia">

Come vedete abbiamo attribuito a type il valore submit.
Per un bottone di reset usare questo codice:

HTML

<input type="text"><input type="reset" value="cancella">

Per disabilitare il bottone aggiungere al codice il tag disabled="disabled"

HTML

<input disabled="disabled" type="submit" value="Invia">

Se volete coordinare il bottone con i CSS del forum quindi basta aggiungere class="forminput"

HTML

<input name="nome" type="submit" value="Invia" class="forminput">

Vediamo ora le aree di testo. L'esempio più semplice è questo

HTML

<input type="text" value="inserire testo" size="50" maxlength="100">

Con size viene determinata la grandezza dell'area di testo e con maxlength il numero massimo di caratteri.
Nel caso c'è bisogno di inserire un testo più lungo, ad esempio di 200 o 700 caratteri utilizzeremo una textarea

HTML

<textarea rows="4" cols="50">
Qui puoi scrivere il tuo testo
</textarea>

Questo codice a differenza degli altri deve essere chiuso. Passiamo ad analizzarlo: Rows rappresenta il numero di righe dell'area e Cols indica i numeri di caratteri per riga.
Potete anche rendere l'area di testo utilizzabile per password, quindi scrivendo appariranno asterischi invece che lettere, utilizzando questo codice

HTML

<input type="password" maxlength="10" size="20">

Potete rendere l'area di sola lettura con questo codice

HTML

<input readonly="readonly" value="Non è possibile scrivere">

Abbiamo semplicemente inserito readonly="readonly".

Vediamo ora come inserire checkbox cioè scelte multiple.

HTML

<input type="checkbox" >checkbox

checkbox

HTML

<input type="checkbox" checked="checked">checkbox selezionato

checkbox selezionato

HTML

<input type="checkbox" disabled="disabled>checkbox disabilitato

checkbox disabilitato

I radio button consentono di effettuare invece una scelta esclusiva.

HTML

<input type="radio" name="utenti" value="gruppo1">
<input type="radio" name="utenti" value="gruppo2">

HTML

<input type="radio" name="utenti" value="gruppo1" checked="checked">Radio selezionato

HTML

<input type="radio" name="utenti" value="gruppo1" disabled="disabled">Radio disabilitato

Tag selectGrazie al tag <select> puoi creare dei menù a tendina

HTML

<select name="sezioni" >
<option value="http://geniv.forumcommunity.net/" selected="selected">Prova 1</option>
<option value="http://geniv.forumcommunity.net/">Prova 2</option>
<option value="http://geniv.forumcommunity.net/">Prova 3</option>
</select>

In oltre le opzioni contenute nel box possono essere divise in categorie con il tag <optgroup>

HTML

<select name="sezioni" >
<optgroup label="gruppo1">
<option value="http://geniv.forumcommunity.net/" selected="selected">Prova 1</option>
<option value="http://geniv.forumcommunity.net/">Prova 2</option>
<optgroup label="gruppo2">
<option value="http://geniv.forumcommunity.net/">Prova 3</option>
</select>

È possibile fare scelte multiple aggiungendo il tag multiple="multiple"

HTML

<select name="sezioni" multiple="multiple">
<option value="http://geniv.forumcommunity.net/" selected="selected">Prova 1</option>
<option value="http://geniv.forumcommunity.net/">Prova 2</option>
<option value="http://geniv.forumcommunity.net/">Prova 3</option>
</select>

In questo cosa tenendo premuto il tast Ctrl si possono effettuare scelte multiple.

N. B.Gli attributi "name" sono filtrati sia nei post che in gestione HTML di forumfree. L'attributo "label" è filtrato nei post, ma utilizzabile in gestione HTML. La textarea è utilizzabile solo nei post, ma non in gestione HTML.