Un Form HTML: guida completa per sviluppatori

๎€ฃ

22 Maggio 2019

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.

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.

Articoli recenti

Commenti recenti

  1. Massimiliano Ferretti su I Commenti

    Mi permetto di aggiungere una mia considerazione personale che ho riportato dall'utilizzo di C#. Personalmente mi piace commentare funzioni e…

  2. Personalmente ritengo che utilizzare git porti sempre dei vantaggi anche per lo sviluppo solo. Giร  solo la possibilitร  di fare…

  3. ciao, il link a discord non รจ piu valido, vorrei utilizzare il materiale che hai pubblicato tempo fa, come faccio?

"

Itamde รจ anche una scuola di programmazione online.

Itamde

Impara ciรฒ che desideri, al tuo ritmo

0 Commenti

Potrebbe interessarti anche...

Rimani aggiornato sulle ultime notizie e novitร 

Accedi ai contenuti riservati

Scopri il dietro le quinte dei nostri progetti, risorse esclusive e lo stato di avanzamento delle nostre creazioni in tempo reale.

Iscriviti alla newsletter

Ricevi le nostre notizie, le nostre riflessioni creative e le novitร  dell'atelier direttamente nella tua casella di posta elettronica.

Seguici

Unisciti alla nostra community sui social network per seguire i nostri progetti quotidiani e interagire con noi.