Per quel che riguarda i campi dei form il tag più utilizzato è l'<input>, che è senza chiusura. Per specificare undeterminato tipo di campo è sufficiente indicare il tipo di input.
Ad esempio:
<input type="text">
crea un campo di testo.
<input type="button">
crea un bottone.
I vari <input> sono dotati di attributi che consentonodi indicare il tipo di campo, il nome (ad esempio per interagire con JavaScript), e il valore (per lo più il testo visualizzato).
Uno dei fattori che ha decretato il successo del Web è senz'altro la possibilità di interagire: la possibilità cioè di iscriversi a servizi di vario tipo (ad esempio mailing list), ma soprattutto di partecipare a vere e proprie comunità virtuali, come il forum di HTML.it .
Per organizzare questo genere di servizi è necessario raccogliere in qualchemodo i dati dell'utente: per farlo si utilizzano, in maniera molto semplice, i moduli (cioè i form).
L'invio dei dati è solitamente organizzato in due parti:
Noi ci occuperemo della sola pagina principale, dal momento che il modo incui struttura una pagina di programmazione esula dagli obiettivi della presenteguida.
Per creare una pagina con dei moduli, bisogna utilizzare l'apposito tag <form>: si tratta di un elemento di blocco, come il <p>, quindi il tag <form> lasciauno spazio prima dell'apertura e dopo la chiusura.
<form name="datiUtenti"action="paginaRisposta.php">
...
</form>
Nel caso in non si desideri avere dello spazio superfluo è possibilemodificare i bordi del tag utilizzando i fogli di stile. Con questa semplice sintassi:
<form name="datiUtenti" style="border:0px"action="paginaRisposta.php">
Come si può vedere, "name" serve per indicare il nome del form, "action" indica l'URL del programma o della pagina dirisposta che processerà i dati.
Grazie all'"action" è anche possibile far sì che i dativengano inviati in e-mail al webmaster (si tratta infatti a tutti gli effetti di un riferimento a un URL). Il codice è questo:
<form action="mailto:tuamail@nomeDominio.it?subject=Oggetto predefinito"
enctype="text/plain" method="POST">
vedremo in una delle prossime lezioni come utilizzare concretamente questa sintassi.
Quando creiamo un form possiamo scegliere due metodi di invio: GETe POST.
Con il metodo GET la pagina di risposta viene contattata e idati vengono inviati in un unico step. Nell'URL della pagina di risposta potremo allora vedere tutti i parametri nella barra degli indirizzi (piùprecisamente nella "query string", cioè nella "stringa di interrogazione") secondo questa forma:
paginaRisposta.php?nome=Wolfgang&cognome=Cecchin&datiInviati=prova+invio
i dati (nella forma nome del campo = valore del campo) sono appesi alla pagina dopo il punto interrogativo.
Alcuni server hanno tuttaviahanno delle limitazioni per quel che riguarda il metodo GET e non consentono di inviare form con valori superiori a 255 carattericomplessivi. Il metodo GET è dunque particolarmente indicato per form con pochi campi e pochi dati da inviare. La sintassi perl'invio in get è:
<form name="datiUtenti" action="paginaRisposta.php"method="GET">
Nel metodo POST invece l'invio dei dati avviene in due stepdistinti: prima viene contattata la pagina sul server che deve processare i dati, e poi vengono inviati i dati stessi. Per questo motivo i parametri noncompaiono nella query string (dunque se non si desidera che i parametri siano mostrati all'utente questo metodo è preferibile).
In questo caso non ci sonolimiti sulla lunghezza dei caratteri. La sintassi è:
<form name="datiUtenti" action="paginaRisposta.php"method="POST">
Prima di passare i dati alla pagina di risposta, che si trova sul server, questi vengono codificati dal browser in modo da non poter dare adito ad errori(ad esempio gli spazi vengono convertiti in "+"). Normalmente non è necessario specificare come si vuole effettuare la codifica dei dati, perché è sottintesol'invio di semplice testo.
A volte però, come quando è necessario inviare un'immagine, è tuttavia indispensabile dichiarare espressamente quali dativogliamo inviare. Per farlo è necessario utilizzare l'attributo "enctype" ("encoding type", cioè "tipodi codifica").
Come dicevamo normalmente non è necessario farlo, perché viene sottintesoquesto tipo di sintassi:
<form name="datiUtenti" action="paginaRisposta.php"enctype="text/plain">
Ma nel caso di invio di immagini dovremo dichiarare:
<form name="datiUtenti" action="paginaRisposta.php"method="post" enctype="multipart/form-data">
Grazie all'attributo "target" è possibile far aprire i dati del form in una pagina differente rispetto a quella corrente (o in una determinata parte di un frameset):
|