Moduli - parte 3
§ 4.10.1.4 Convalida della form lato client.
Le form possono essere "annotate" in modo che il loro contenuto venga controllato prima dell'invio. Sebbene anche il server debba controllare la validità degli input per evitare intrusioni dannose, il controllo lato client serve ad evitare, direttamente in partenza, l'invio di dati non corretti.
L'annotazione più semplice a nostra disposizione è l'attributo required specificato nell'elemento <form>.
Con riferimento alla form per ordinare la pizza, l'aggiunta dell'attributo required ai campi cliente, taglia e orario rende obbligatoria la compilazione di questi campi.
E' inoltre possibile limitare la lunghezza dei campi di imput con l'attributo maxlengh. Nell'esempio, la lunghezza della <textarea> è stata limitata a 30 caratteri.
La form per ordinare la pizza può essere completata come segue:
<form method="post"
enctype="application/x-www-form-urlencoded"
action="echoParametri.php">
<div><pre><label>Nome cliente: <input name="custname" required></label></pre></div>
<div><pre><label> Telefono: <input type=tel name="custtel"></label></pre></div>
<div><pre><label> E-mail: <input type=email name="custemail></label></pre></div>
<fieldset>
<legend> Taglia </legend>
<div><label> <input type=radio name=size value="piccola" required> Piccola</label></div>
<div><label> <input type=radio name=size value="media" required> Media</label></div>
<div><label> <input type=radio name=size value="grande" required> Grande</label></div>
<fieldset>
<fieldset>
<legend> Ingredienti </legend>
<div><label> <input type=checkbox name="topping[]" value="Bacon"> Bacon</label></div>
<div><label> <input type=checkbox name="topping[]" value="Funghi"> Funghi</label></div>
<div><label> <input type=checkbox name="topping[]" value="Cipolla"> Cipolla</label></div>
<div><label> <input type=checkbox name="topping[]" value="Carciofini"> Carciofini</label></div>
<fieldset>
<fieldset>
<legend> Consegna </legend>
<div><pre><label>Orario:<input type=time min="11:00" max="23:00" step="900"
name="delivery" required></label></pre></div>
<div><pre><label>Istruzioni particolari:<textarea name="comments" maxlength=30>
</textarea></label></pre></div>
<div><pre><button>Invia</button></pre></div>
</form>
Nota sul modo di specificare gli attributi
Nel codice precedente si può notare che il valore assegnato agli attributi, a volte è è racchiuso fra virgolette e a volte no. La sintassi HTML permette ciò. Per un approfondimento sull'argomento si veda:§8 The HTML syntax Quello che mi sento di poter dire è che le virgolette sono necessarie quando l'attributo contiene spazi.
Questo è il risultato finale:
Nota
Il processamento eseguito dallo script, specificato con l'attributo action, è la visualizzazione dei parametri inseriti nella form. Ecco il codice. echoParametriPost.php