Il logo del sito

Appunti su HTML - Moduli

Moduli - parte 4

§ 4.10.1.5 Abilitazione auto fill lato client.

Alcuni browser tentano di aiutare gli utenti compilando automaticamente i controlli delle form. Questo può essere fatto con l'attributo autocomplete. Nell'esempio dell'ordine per la pizza, autocomplete può essere applicato ai primi tre campi:

L'attributo autocomplete non può assumere un valore qualsiasi. L'elenco completo dei valori che può assumere si può trovare qui:§4.10.18.8.1 Autofilling form controls: the autocomplete attribute

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 
      autocomplete="name"></label></pre></div>
   <div><pre><label>    Telefono: <input  type=tel name="custtel" 
      autocomplete="tel"></label></pre></div>
   <div><pre><label>      E-mail: <input  type=email name="custemail" 
      autocomple="email"></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>
            

Come abilitare le impostazioni di compilazione automatica su alcuni browser

In Chrome: Seleziona Impostazioni, Avanzate, Password e moduli, Impostazioni di compilazione automatica.

In Firefox: Seleziona Opzioni, Privacy, Cronologia, Impostazioni cronologia: utilizza impostazioni personalizzate,

In Internet Explorer: Seleziona Opzioni, Opzioni Internet, Contenuto, Completamento automatico, Impostazioni, Moduli.

Form Ordine Pizza

Taglia
Ingredienti
Consegna

Nota

Il processamento eseguito dallo script, specificato con l'attributo action, è la visualizzazione dei parametri inseriti nella form. Ecco il codice. echoParametriPost.php