📢 Nuovo Corso Tailwind Completo disponibile!

Attributi dei Form HTML

Questo capitolo descrive gli attributi diversi per l’elemento HTML <form>.

L’attributo “action”

L’attributo “action” definisce l’azione da eseguire quando il modulo viene inviato.

Di solito, i dati del modulo vengono inviati a un file sul server quando l’utente clicca sul pulsante di invio.

Nell’esempio seguente, i dati del modulo vengono inviati a un file chiamato “action_page.php”. Questo file contiene uno script lato server che gestisce i dati del modulo:

<form action="/action_page.php">
  <label for="nome">Nome:</label><br />
  <input type="text" id="nome" name="nome" value="Luca" /><br />

  <label for="cognome">Cognome:</label><br />
  <input type="text" id="cognome" name="cognome" value="Rossi" /><br /><br />

  <input type="submit" value="Invia" />
</form>

Se l’attributo “action” viene omesso, l’azione viene impostata sulla pagina corrente.

L’attributo “target”

L’attributo “target” specifica dove visualizzare la risposta ricevuta dopo l’invio del modulo.

L’attributo “target” può avere uno dei seguenti valori:

  • _blank La risposta viene visualizzata in una nuova finestra o scheda
  • _self La risposta viene visualizzata nella finestra corrente
  • _parent La risposta viene visualizzata nella cornice padre
  • _top La risposta viene visualizzata nell’intero corpo della finestra
  • framename La risposta viene visualizzata in un iframe denominato

Il valore predefinito è “_self”, il che significa che la risposta verrà aperta nella finestra corrente.

L’attributo “method”

L’attributo “method” specifica il metodo HTTP da utilizzare quando si inviano i dati del modulo.

I dati del modulo possono essere inviati come variabili URL (con “method=“get”) o come transazione POST HTTP (con “method=“post”).

Il metodo HTTP predefinito per l’invio dei dati del modulo è GET.

Questo esempio utilizza il metodo GET quando si inviano i dati del modulo:

<form action="/action_page.php" method="get">
  <!-- Elementi del modulo qui -->
  <input type="submit" value="Invia" />
</form>

Questo esempio utilizza il metodo POST quando si inviano i dati del modulo:

<form action="/action_page.php" method="post">
  <!-- Elementi del modulo qui -->
  <input type="submit" value="Invia" />
</form>

Note su GET:

  • Aggiunge i dati del modulo all’URL, in coppie nome/valore.
  • NON utilizzare mai GET per inviare dati sensibili! (i dati del modulo inviati sono visibili nell’URL!)
  • La lunghezza di un URL è limitata (2048 caratteri).
  • Utile per inviare moduli dove l’utente desidera memorizzare il risultato.
  • GET è adatto per dati non sicuri, come le stringhe di query in Google.

Note su POST:

  • Aggiunge i dati del modulo all’interno del corpo della richiesta HTTP (i dati del modulo inviati non vengono mostrati nell’URL).
  • POST non ha limiti di dimensione e può essere utilizzato per inviare grandi quantitĂ  di dati.
  • I moduli inviati con POST non possono essere contrassegnati.
  • Utilizzare sempre POST se i dati del modulo contengono informazioni sensibili o personali!

L’attributo “autocomplete”

L’attributo “autocomplete” controlla se il modulo deve avere l’autocompletamento attivato o disattivato. Quando l’autocompletamento è attivo, il browser suggerisce automaticamente i valori in base ai valori inseriti precedentemente dall’utente.

<form action="/action_page.php" autocomplete="on">
  <!-- Elementi del modulo qui -->
  <input type="submit" value="Invia" />
</form>