Guide

Corso HTML – Lezione 12: HTML Forms

Forms

Forms

Forms sono una sezione di documento contenente elementi normali o speciali come markup, etichette e controlli alle etichette.

Forms sono generalmente usati per il controllo sull’immissione di dati nel web. Questo può essere effettuato mediante speciali elementi chiamati controlli ed etichette a questi controlli. 

Controlli:

  • Buttons;
  • Checkboxes;
  •  Radio buttons;
  •  Menus;
  • Text input;
  •  File select;
  •  Hidden control;
  •  Object controls;

Per un controllo più approfondito e dettagliato bisogna combinare l’utilizzo di questi controlli con funzioni javascript.
Possiamo però, mediante gli attributi a nostra disposizione, definire alcune specifiche secondo le nostre preferenze.

<head>
<meta http-equiv="Content-type" content="text/html; charset=ISO-8859-1">
<title>Esempio Forms in HTML</title>
</head>
<body>
<form action="pagine_web.htm" method="post">
<p>Nome: <input type="text" name="name"><br>
Cognome: <input type="text" name="surname"><br>
<input type="submit" value="invia"></p>
</form>
</body>

Attributi dei FORMS

Per prima cosa possiamo notare come il tag <form>necessiti di una apertura e di una chiusura, questo affinché sia possibile includere al suo interno tutti gli elementi che si desidera utilizzare. Nel tag di apertura è obbligatorio specificare due attributi:

  • Action il cui valore serve a specificare il percorso della pagine web a cui si desidera inviare i dati;
  • Method rappresenta il metodo con cui si desidera inviare i dati, l’invio può avvenire in due diversi metodi:
      • Get consente un invio limitato di dati, i valori vengono visualizzati sulla barra degli indirizzo durante l’invio. Questo metodo viene usato quando non si effettuanomodifiche collaterali” ma solo azioni come ricerche all’interno di un Data Base;
      • Post è il metodo consigliato per l’invio di un numero di dati elevato o che non si vuole rivelare. Molto utile in caso di compilazione di schede di registrazione. L’utilizzo del metodo post  può effettuare una “modifica collaterale” come nel caso di inserimento dati in un Data Base.

I due attributi sopra descritti, sono importanti affinché i forms possano eseguire in modo corretto il compito di invio dati. Possiamo inoltre sfruttare altri tipi di attributi il cui utilizzo è facoltativo.

  • Name è l’attributo che ci permette di assegnare un determinato nome con cui riferirci ad uno specifico form;
  • Accept specifica il tipo di file che può essere presentato in caso di upload;
  • Accept-charset serve a indicare il tipo di caratteri che il server può gestire per i dati del form;
  • Enctype ci permette di specificare in che modo i caratteri devono essere codificati prima dell’invio al server. I valori che può assumere sono:
      • application/x-www-form-urlencoded è il valore predefinito. Tutti i caratteri vengono codificati prima dell’invio (gli spazi vengono convertiti in “+”, simboli e caratteri speciali vengono convertiti in valori HEX ASCII);
      • multipart/form-data, nessun carattere è codificato. Questo valore è necessario quando si utilizzano moduli che hanno un controllo dei file caricati;
      • text/plain Gli spazi vengono convertiti in simboli “+”, ma non viene effettuata alcuna conversione sui caratteri speciali.

Riassumiamo con un esempio pratico i quattro attributi descritti.

<form action="web_page.php" accept="image/gif,image/jpeg" accept-charset="ISO-8859-1" enctype="multipart/form-data">
  Name: <input type="text" name="fname"><br>
  Surname: <input type="text" name="lname"><br>
  Your picture: <input type="file" name="immagine" id="immagine"><br>
  <input type="submit" value="invia">
</form>
Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

Le guide più interessanti