Moduli e Forms

Nelle lezioni precedenti abbiamo imparato molto, almeno questo voglio credere o sperare :-))

Dovremo essere in grado di creare e gestire un sito, magari semplice ma comunque un sito tutto nostro e al quale non manca assolutamente nulla.

Adesso però vorremo anche qualcosa di leggermente più complesso, più professionale, del tipo: come interagire con i nostri visitatori per conoscerli o per sapere cosa ne pensano del nostro lavoro?. Per fare questo ci si deve costruire un Modulo o Form

I forms, possono essere utilizzati per svariate forme di comunicazione, adoperati da soli, cioè con i soli elementi offerti da html hanno forse delle limitazioni, e comunque si riesce a risolvere un'elevata percentuale di problematiche. Se associati ad un qualsiasi linguaggio di scripting  (javascript per esempio), acquisiscono una potenza incredibile, sono in grado di ricevere ed inviare dati a/da pagine diverse, eseguire operazioni matematiche, effettuare controlli anche di tipo piuttosto complesso e molto molto altro ancora.

Un modulo (form) può essere costituito da diversi elementi quali: caselle per introduzione testo, menù a tendina dai quali poter effettuare delle scelte, caselle di tipo spunta, caselle per selezioni singole o multiple, aree più o meno grandi per raccogliere commenti e descrizioni, caselle nascoste per password, pulsanti di invio, pulsanti di annullamento.

Una volta capita la tecnica potrete poi arricchirlo voi stessi di tutti gli elementi che  necessiteranno.

Vediamo come crearne uno; il più semplice:

<form>

Questo è l'elemento che dichiara il modulo, da solo dice poco o niente, necessita di alcuni attributi, almeno due: ACTION e METOD volendo anche un terzo opzionale: NAME e servono rispettivamente:

ACTION per indirizzare il modulo al server, all' URL, al CGI o all'indirizzo di posta.

METOD per dichiarare con quale dei due possibili metodi: POST e GET si devono trasmettere i dati.

NAME Il nome che preferite assegnare al modulo,diventa  opzionale in HTML ma indispensabile se si dovesse far uso di JavaScript o altro linguaggio di programmazione.

I campi che compongono un modulo si ottengono con l'elemento <INPUT>
al quale vanno assegnati alcuni parametri quali :

type e sono molti i tipi associabili, noi adopereremo Text
name Il nome del campo che raccoglie il dato introdotto.

Questo il listato:
<form>
Inserisci il tuo nome: <input type="Text" name="tuo nome">
</form>

e questo il risultato a video:


Inserisci il tuo nome:

Potete anche inserire il vostro nome, di fatto non servirà a nulla in quanto per funzionare correttamente al modulo mancano due cose: il pulsante per l'invio e le specifiche relative a dove inviarlo.

Per il pulsante di invio si procede creando un altro elemento <INPUT> questa volta però metteremo come Type l'attributo Submit che serve per creare il pulsante di invio, aggiungeremo anche Value per la scritta che dovrà comparire sul pulsante.

Adesso il nostro listato è questo:
<form>
Inserisci il tuo nome: <input type="Text" name="tuo nome">
<input type="Submit" value="invia">
</form>

Questo il risultato a video:


Inserisci il tuo nome:

Se provate ad introdurre il vostro nome e a premere il pulsante "invia" vi accorgerete che non succederà ancora nulla, o quasi...
Il modulo infatti pur funzionando non sa ancora  a chi inviare i dati appena raccolti e neppure in quale formato.

Di solito un form lo si invia ad uno script CGI, uno dei tanti messi a disposizione dai vari server della rete, per ragioni di sicurezza e al fine di contenere lo SPAM questa operazione è divenuta ormai  possibile soltanto col server sul quale si ha il proprio sito. Gli script  in cgi  provvedono a ricevere i dati, effettuare dei controlli e dopo averli formattati  passano all'immediata spedizione (send-mail), cioè si fa uso di un servizio semplicemente richiamandolo e questo è, come ho appena detto, di solito compreso con lo spazio web dove si ha il proprio sito. Verificatelo negli accessori o servizi offerti, è probabile trovarlo sotto la voce di formmail o sendmail.

Questo CGI offre la possibilità di ricevere i dati provenienti dal vostro form e li inoltra sulla casella postale da voi specificata, la vostra ovviamente, con il vantaggio di inviarvi tutti i dati opportunamente ordinati e senza obbligare chi compila il modulo a dover inserire la propria e-mail, se da una parte favorisce i messaggi anonimi dall'altra incentiva i commenti anche di coloro che non amano lasciare il  proprio indirizzo e-mail in giro per la rete.

Mi rendo conto che per un principiante non sia molto semplice capire questo meccanismo, ma vi garantisco che non è neppure troppo difficile :-)

vediamo un paio di esempi che certamente chiariranno molto meglio ogni cosa:


I metodi per ricevere un form sono almeno due:

1) inoltrando il tutto al server CGI (quando questo è conosciuto) o script in php, asp ecc.ecc..

2) inoltrando il tutto alla propria casella postale.

Vantaggi e svantaggi dei due metodi:

1) Il server CGI o script in php asp è di sicuro il sistema migliore, abbiamo detto che permette l'invio del modulo anche da parte di chi non ha una casella postale o da chi molto più semplicemente non vuole farne uso per non renderla pubblica. Questo sistema provvede all'ordinamento e alla formattazione dei dati prima di recapitarli all'indirizzo e-mail. Gli script spesso offrono controlli sui dati introdotti e inviano anche diverse informazioni quali: l'ora, il giorno, l'URL del mittente. Purtroppo a volte negli script in CGI non tutti sono a conoscenza dei parametri utilizzabili nel modulo, anche se questi sono forniti dallo stesso provider dove si ha il sito.

2) La propria casella postale che è possibile utilizzare immediatamente  non dovendo infatti conoscere altri dati oltre a quello, di contro c'è che si possono ricevere i moduli soltanto se chi li invia è disposto ad adoperare il proprio indirizzo di posta elettronica, è infatti grazie a questo che il modulo potrà essere spedito e di conseguenza recapitato. I dati sono meno ordinati ma comunque leggibili.


Vediamo come farci inviare il form sopra, composto da un solo campo adoperando entrambi i sistemi. Dovremo fare uso dei due attributi spiegati all'inizio di questa lezione e cioè: Method ed Action

Per spedirlo tramite posta elettronica:

<form method="post" action="mailto:vostronome@serverdiposta.it" enctype="text/plain" name="mio_form">

Tuo nome: <input type="Text" name="tuo nome">

giudizio: <input type="Text" name="giudizio">

<input type="Submit" value="invia">

</form>

Questo il risultato a video:


Il tuo giudizio su questa rubrica:

Tuo nome:
giudizio:
 

Facendo uso di una tabella, le abbiamo imparate nella lezione precedente, è stato possibile dare al form un aspetto molto più ordinato oserei dire professionale :-))

Se volete provarlo funziona tutto ma non sappiamo a chi arriverà  ho dovuto infatti togliere il mio indirizzo e-mail per ragioni di spam, ma questo è un rischio che chiunque abbia un sito web dovrà correre.

Se inserite il vostro vi sarà recapitato in mail-box, in questo formato:

tuo nome=xxxxxx
giudizio=yyyyyy

Se questo sistema vi soddisfa non vi resta che crearvi tutti i moduli che volete e farveli spedire... è possibile aggiungere anche il titolo o subject alla mail che vi consegnerà i dati del modulo, notate l'aggiunta di ?subject all'elemento form:

<form method="post" action="mailto:vostronome@serverdiposta.it?subject=dalla lezione primi passi" enctype="text/plain" name="mio_form">

Tuo nome: <input type="Text" name="tuo nome">

giudizio: <input type="Text" name="giudizio">

<input type="Submit" value="invia">

</form>

L'altro sistema invece è quello di affidare il tutto al server CGI.

La struttura resta la stessa ma al posto di :

<form method="post" action="mailto:vostronome@serverdiposta.it" enctype="text/plain" name="mio_form">

Dovremo adoperare un indirizzo di CGI valido, ripeto: informatevi sulla home page del server dove avete il sito, vi assicuro che questo servizio è comune a molti, per non dire a tutti gli spazi web offerti gratuitamente.

Purtroppo non basta soltanto l'indirizzo del CGI, servono anche altri parametri che il fornitore del servizio richiede.

Se siete certi che il vostro server, quello su cui avete messo il vostro sito, non offre questo servizio, potete cambiare server oppure passare al sistema che usa la mailbox, i siti che offrono questo servizio a tutti indistintamente sono sempre più rari e questo a causa di abusi da parte di utenti anonimi .

Con questa lezione abbiamo imparato anche a cosa servono a come si costruiscono i  moduli, una delle cose più difficili per un principiante. Siamo quasi alla fine, non arrendetevi proprio adesso, ormai non resta molto.

Nella prossima lezione, vedremo come inserire la musica, gli script e le applet.

 
Lezione Precedente   Lezione Successiva