HTML: tipi di form input, button, text

Il TAG FORM contiene una serie di TAG che permettono di ricevere i dati a seconda del loro tipo. Esistono diverse tipologie di TAG che consentono al web designer di scegliere il più appropriato per disegnare l'interfaccia di raccolta dei dati.

INPUT: è il tag più utilizzato, non ha chiusura non contenendo contenuti e possiede alcuni attributi che ne specificano l'utilizzo:

  • TEXT: crea un campo di testo

    <input type=”text”>

  • BUTTON: genera un bottone

    <input type=”button”>

  • VALUE: indica un valore iniziale predefinito

    <input type=”text” name=”tuoTesto” value=”qui il tuo testo”>

  • NAME: consente di identificarne il nome, è utilizzato con le funzioni JavaScript

    <input type=”text” name=”tuoTesto”>

Con il campo INPUT è possibile inviare i testi assegnando TYPE=text. Ci sono deiverse soluzioni per scrivere un testo in un FORM:

  • TYPE=PASSWORD permette di celare il testo scritto

    <input type="password" maxlength="8" size="18" value="mia_password" name="mioTesto" />


     
  • assegnando al campo INPUT l'attributo READONLY è possibile creare un campo testo di sola lettura

    <input readonly="readonly" maxlength="8" size="25" value="leggere l'informativa" name="mioTesto" />  

  • assegnando DISABLED al campo INPUT è possibile disabilitare il campo di testo

    <input disabled="disabled" maxLength="8" size="25" value="leggere l'informativa" name="mioTesto" />

Per inserire un campo di testo che vada su più righe si utilizza il campo TEXT al posto del campo INPUT:

<textarea name="testo" rows="5" cols="40">

	  qui puoi scrivere il tuo testo

</textarea>

Con il campo INPUT è possibile creare dei bottoni, assegnando  TYPE=button.
Con SUBMIT possiamo asegnare al campo INPUT il valore di bottone però con la funzione di INVIA:

<form action=http://www.webgab.eu target=”_blank”>
	  <input type=”submit” value=”visita webgab.eu”>
</form>
 

RESET permette di cancella il testo dei dati inseriti, invece di inviarli:

<form action=prova>

	    <inputtype=”text”><br>

	    <input type=”reset” value=”cancella”>

	</form>

 

Il TAG BUTTON può essere utilizzato al posto di INPUT per creare i bottoni. Assegnandogli igli attributi TYPE=button  TYPE=reset e TYPE=submit si possono generare le stesse azioni che abbiamo descritto precedentemente per INPUT

<form action="http://www.webgab.eu" target=”_blank”>
   <input type=”text”><br>
   <button type=”button”>
	  bottone generico
   </button>

   <button type=”reset”>
	  cancella
   </button>

   <button type=”submit”>
	   invia
   </button>
</form>

L'attributo DISABLE consente di disabilitare l'invio di dati

<button disabled=”disabled” type=submit>

Il campo IMAGE  consente di sostituire il bottone con un INPUT TYPE=image, creando così un bottone personalizzato, i suoi attributi sono gli stessi del TAG IMG ():

	<form action="http://www.webgab.eu" target="_blank">

	    <input name="invia _cke_saved_name=" _cke_saved_name="invia _cke_saved_name=" _cke_saved_name="invia _cke_saved_name=" _cke_saved_name="invia _cke_saved_name=" _cke_saved_name="invia _cke_saved_name=" _cke_saved_name="invia _cke_saved_name="invia il modulo" _cke_saved_name="invia il modulo" _cke_saved_name="invia il modulo" type=”image” src=”invia.gif” alt=”invia il modulo” title=”invia il modulo” width=”78″ height=”38″>

	</form>