form

Il modo più semplice per inviare le informazioni al server è quello di usare un form HTML. Quando un utente chiede di inviare i dati (normalmente premendo un pulsate "invia" o simile) il browser invia una richiesta http al server e la risposta prende il posto della pagina attuale.

Il tag HTML che serve per realizzare un form è form di cui dobbiamo usare almeno due attributi: action e method: il primo indica a quale URL inviare i dati e il secondo con quale metodo farlo (GET o POST nel nostro caso).

All'interno del tag form possiamo utilizzare altri tag a seconda del dato che vogliamo chiedere all'utente, esistono diversi dati che possono essere chiesti con diverse modalità e con diverso supporto da parte dei browser.

input

Di input ci interessano in particolare tre attributi: name, value e type.

name

è il nome che verrà associato al dato immesso dal'utente, ad esempio lato server viene usato per recuperare il valore immesso dall'utente

value

il valore predefinito del dato

type

indica il tipo di campo da creare, ad esempio

text

una casella per immettere del testo

submit

un pulsante, alla pressione verranno inviati i dati al server e la pagina di risposta verrà caricata

password

come "text" ma i dati immessi non sono visibili

hidden

campo non visibile all'utente, serve l'attributo value

select

Questo tag realizza un menu con delle voci al suo interno. L'attributo name indica quale sarà il nome associato al dato inviato al server mentre il suo valore va specificato nei tag option in esso contenuti. A sua volta il tag option ha un attributo value che indica il valore che sarà inviato al server se tale voce viene selezionata, questo valore non viene però mostrato all'utente che vedrà invece il contenuto di option.

esempio

<form action="script.php" method="post">
  <p><label for="nome">nome:</label><input id="nome" type="text" name="nome"></p>
  <p><label for="nome">cognome:</label><input type="text" name="cognome"></p>
  <p><label for="nome">continente:</label>
    <select id="continente" name="continente">
      <option value="eu">Europa</option>
      <option value="as">Asia</option>
      <option value="oc">Oceania</option>
      <option value="af">Africa</option>
      <option value="am">America</option>
    </select></p>
  <input type="submit">
</form>

Il tag label serve per indicare la descrizione di un elemento di input, è utilizzato per semplificare la navigazione degli utenti in un form (ad esempio dagli screen reader), l'attributo for fa riferimento all'id dell'elemento a cui associare la label.