Cos'è un web form in HTML?

In informatica, un form (o formulario, modulo) è un termine utilizzato per riferirsi all’interfaccia di un’applicazione che consente all’utente client di inserire e inviare al web server uno o più dati liberamente digitati dallo stesso; per descriverlo può essere utile la metafora della “scheda da compilare” per l’inserimento di dati.

Sommario

Nella maggior parte dei casi il termine è riferito a form contenuti in una pagina web: ad esempio le caselle di testo e i menu a tendina di una pagina di registrazione o di login costituiscono un form.

Più in particolare, l’elemento HTML è usato per realizzare form in una pagina web. In HTML sono considerati parte del form anche i pulsanti ripristina o cancella e invia. Di solito i form vengono utilizzati per inviare dati ad un database server oppure per inviare e-mail.

Si tratta dunque di un elemento che inserisce contenuti interattivi per l’utente nella pagina web o in un’applicazione web inserendosi nel contesto del web dinamico. Tutti i dati di un form una volta inviati dal web browser del client al web server devono essere trattati o elaborati da una pagina web dinamica lato server.

Sottoelementi

Tra i sottoelementi possibili di un form abbiamo:

caselle di testo;
casella password;
selezione singola (radio button);
casella di spunta (checkbox);
menù a tendina:
combo box;
list box;
drop-down List;
aree di testo;
upload di file del file system;
pulsanti di invio e reset

Esempio di form html

Ecco un esempio di un semplice form HTML che permette all’utente di inserire il proprio nome e inviare i dati:

<!DOCTYPE html>
<html>
<head>
  <title>Esempio di Form HTML</title>
</head>
<body>
  <h1>Benvenuto!</h1>

  <form action="process.php" method="POST">
    <label for="name">Nome:</label>
    <input type="text" id="name" name="name" required>

    <br>

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

In questo esempio, abbiamo un semplice form che richiede all’utente di inserire il proprio nome. Il form invierà i dati a un file di elaborazione chiamato “process.php” utilizzando il metodo HTTP POST.

Il campo di input è definito con l’attributo type="text" che indica che l’utente può inserire del testo. L’attributo id viene utilizzato per identificare univocamente il campo, mentre l’attributo name specifica il nome del campo che verrà utilizzato per inviare i dati al server.

L’attributo required viene utilizzato per indicare che il campo è obbligatorio e non può essere lasciato vuoto.

Infine, il pulsante di invio è definito con l’elemento <input> di tipo “submit” che invierà i dati del form al server quando viene cliccato.

Ricorda che dovrai sostituire l’attributo action con l’URL o il percorso del tuo script di elaborazione dei dati del form.

Per aggiornarti o formarti in questo settore scopri i corsi di Web Developer Full Stack di Develop4fun!

I nostri corsi : https://www.develop4fun.it/premium-corsi-online-in-abbonamento

▼ SEGUICI SU ▼
» Facebook: https://www.facebook.com/developforfun
» Instagram: https://www.instagram.com/develop4fun
» Twitter: https://twitter.com/Develop4funW

VISITA IL NOSTRO SITO WEB: https://www.develop4fun.it
ISCRIVITI SUBITO AL NOSTRO CANALE: https://www.youtube.com/channel/UCZ4dhshzpVbbRPVuL9TNH4Q