Appunti sui form

Materie:	Appunti
Categoria:	Informatica
Voto:	2 (2)
Download:	46
Data:	31.01.2001
Numero di pagine:	6
Formato di file:	.doc (Microsoft Word)

Manuale Form
Il manuale seguente ti mostrerà come rendere interattive le tue pagine utilizzando le . Con il tag form puoi inserire nelle tue pagine web un guestbook, richieste di ordini, verifiche, avere feedback o altro ancora.
zatrabeoj
Le istruzioni base per creare un form html sono le seguenti...
comando di inizio form
comando per la richiesta di informazioni
...si possono creare una o più aree di imput, secondo le esigenze
comando di chiusura form
Ora sei pronto per realizzare una tua form!
Manuale Form- Lezione 1
Apri Notepad e seguimi!. Copia e incolla la pagina e via partiamo!:
Joe è il ragazzo più affascinante che io conosca

Salva il file come form1.html in una cartella (gli utenti di Win3.x la salvino come form1.htm). Ora apri il tuo browser [plug Netscape] e da qui visualizza il file che hai appena salvato form1.html lasciando aperti entrambe i programmi per effettuare simultaneamente la visualizzazione sul browser delle correzioni effettuate in Notepad. E' sufficiente cliccare sul bottone del reload del browser, se non viene apportato alcun cambiamento prova a cliccare sul bottone del reload tenendo premuto il tasto dello Shift.
Digita quanto segue nel tuo tag form.
Joe è il ragazzo più affascinante che io conosca

Nel prossimo passaggio mostriamo come dire al browser dove e come inviare i dati. Si può procedere in due modi. 1) puoi inviare i dati ad uno script cgi script, o 2) puoi far si che i dati siano inviati tramite email a te. Il primo comando, vale a dire lo script ti dice come dovrebbero essere inviati i dati.
Il secondo, o mailto dovrebbe avere nel tag i seguenti attributi.
Nota bene- Microsoft Internet Explorer 3.0 non supporte le form mailto. Quando tenti di inviare le informazioni, la finestra del nuovo messaggio scompare. Explorer does however support forms sent to a CGI script.
Joe è il ragazzo più affascinante che io conosca

Questo punto è molto importante. L'unica cosa da fare è inserire il tuo indirizzo di posta elettronica dopo mailto: il resto deve essere scritto esattamente come indicato. Le parole FORM, METHOD, POST & ACTION non devono essere scritte in maiuscolo ma è necessario uno spazio tra ciascun attributo.. tra FORM & METHOD, tra POST & ACTION, e tra .com" & ENCTYPE.
I dati saranno inviati solo in questo formato compatibile al computer...
FORMNAME=New+Entrant&NAME=R.U.+Havinfun&ADDRESS=1313+Mockingbird+Lane
&CITY=Beverly+Hills&STATE=CA
E' necessario uno script CGI per leggere i dati...
FORMNAME=New Entrant
NAME=R.U. Havinfun
ADDRESS=1313 Mockingbird Lane
CITY=Beverly Hills
STATE=CA
Nota bene che XOOM.it al momento non ha uno script CGI per i membri. E' necessario inserire una terza parte che ha uno script al quale puoi collegare un link, o utilizzare in alternativa il metodo descritto sotto ENCTYPE="text/plain".
L'esempio sottostante mostra che una form altro non è che una serie di nomi di imput (NAME, ADDRESS, ecc) accoppiati con valori di imput (R.U. Havinfun, 1313 Mockingbird Lane, etc).L'unica variabile è come inserire i valori.
alcuni programmi di posta sono in grado di convertire i dati senza ricorrere ad altri programmi. Cancella le istruzioni ENCTYPE="application/x-www-form-urlencoded" e al loro posto utilizza ENCTYPE="text/plain".

Manuale Form- Lezione 2
Ora, per semplificare le cose vi mostrerò solo i dati che devono essere inseriti all'interno del tag . Tralascio l'intestazione, il corpo, il titolo. Lasciali nel documento, non cancellarli.
Il più comune TIPO di FORM è TEXT.

Inizio modulo
Fine modulo
Ogni input necessita di un NOME.

Inizio modulo
Fine modulo
Quando l'utente digita nel suo indirizzo (per esempio 1313 Mockingbird Lane), diventerà il valore di imput e sarà accoppiato con ADDRESS affinchè il risultato finale sarà ADDRESS=1313 Mockingbird Lane.
Se vogliamo si può digitare in un VALUE.

Inizio modulo
Fine modulo
Questa operazione automaticamente accoppierà il valore 44 Cherry St con il nome ADDRESS, senza che l'utente lo modifichi. Nota bene- assicurati di utilizzare le virgolette come specificato.
Si può specificare la dimensione della casella di testo di input.

Inizio modulo
Fine modulo

Inizio modulo
Fine modulo

Inizio modulo
Fine modulo
Il valore di default è 20. Questo valore di default è quello che il browser assume se non gli si sono date altre specifiche indicazioni.
Ora rimuovi VALUE="44 Cherry St".

Inizio modulo
Fine modulo
Si può anche specificare il numero di caratteri permessi.
Prova a inserire più di 10 caratteri!

Inizio modulo
Fine modulo
Molto simile al TYPE=TEXT è il TYPE=PASSWORD. E' esattamente la stessa cosa, cambia solo il tipo di inserimento; in questo caso si utilizzano ***. Il browser ti invierà l'input, ma non lo mostrerà.

Inizio modulo
Fine modulo
Ricorda che ciascun deve avere un NOME.

Inizio modulo
Fine modulo
SIZE, VALUE, e MAXLENGTH sono attributi anche qui utilizzabili. Un dice al browser di fare qualcosa. Un ATTRIBUTO lavora all'interno del e dice al browser come farlo.
Seguono i bottoni Radio e le Check Boxes. I bottoni Radio buttons permettono all'utente di scegliere tra uno o più opzioni. Check Boxes permettono di scegliere tra una, più o tutte le opzioni.
Creiamo qualche bottone Radio.

Inizio modulo
Fine modulo
Aggiungiamone altri 2.

Inizio modulo
Fine modulo
Hmmm... è meglio inserire una linea di separazione tra ciascuno.

Inizio modulo
Fine modulo
Nota che ciascun input ha lo stesso nome.
A ciacun bottone Radio deve essere assegnato un VALUE.

Inizio modulo
Fine modulo
Ora diamo un nome a ciascun bottone.
Ed Holleran
Rick Weinberg
Tom Studd
Inizio modulo
Ed Holleran
Rick Weinberg
Tom Studd
Fine modulo
Puoi modificare i nomi come più ti piace.
Diciamo che ora i bottoni Radio sono creati.
Chi è il tuo migliore amico?
Ed Holleran
Rick Weinberg
Tom Studd
Inizio modulo
Chi è il tuo migliore amico?
Ed Holleran
Rick Weinberg
Tom Studd
Fine modulo
Naturalmente l'utente può scegliere una sola opzione. La sua scelta ti arriverà come coppia name/value MIGLIORE AMICO=Ed (o comunque chi ha scelto).
Creare Check Boxes è praticamente la stessa cosa.

Inizio modulo
Fine modulo
Aggiungine altre 3, dando a ciascuna un NOME diverso. (puoi anche inserire linee di separazione)

Inizio modulo
Fine modulo
Ciascuna Check Box ha lo stesso VALUE.

Inizio modulo
Fine modulo
Nota- Per le Check Boxes il NOME cambia e il VALUE resta lo stesso e con i bottoni Radio, il VALUE cambia ma il NOME resta lo stesso.
Ora dai un nome a ciascuna casella.
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister Meisterburger
Inizio modulo
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister Meisterburger
Fine modulo
Quale di questi ragazzi è un tuo amico?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister Meisterburger
Inizio modulo
Quale di questi ragazzi è un tuo amico?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister Meisterburger
Fine modulo
L'utente può scegliere 1, 2, nessuno o tutte le opzioni. La sua scelta ti arriverà come name/value.
Ed=YES
Tom=YES
(o qualunque altra scelta... se non scelgono nessuno nonti arriverà alcun nome)
Ora, una domanda nasce spontanea... Cosa accade se voglio fare 3 domande diverse sullo stesso gruppo di ragazzi??
Ecco la risposta!.
Inizio modulo
Quali di questi ragazzi sono tuoi amici?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister
A quale di questi ragazzi impresteresti del denaro?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister
A quale di questi ragazzi lasceresti frequentare tua sorella?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister
Fine modulo
E' chiaro che in ciascuna di queste form non dovrebbe mai essere duplicato il NOME. Quindi possiamo utilizzare un nome differente per ciascuna domanda. Dico mai per evitare di creare situazioni di confusione
Quella che segue è la sintassi html per le tre domande.I tag sono in verde. Il loro scopo è solo apparente, non influiscono sulle form. Per evere maggiori informazioni sulle tabelle clicca su Table Tutor.

Quali di questi ragazzi sono tuoi amici?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister

A quali di questi ragazzi impresteresti del denaro?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister

A quale di questi ragazzi lasceresti frequentare tua sorella?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister

Supponiamo che l'utente abbia selezionato le seguenti tabelle...
Inizio modulo
Quali di questi ragazzi sono tuoi amici?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister
A quali di questi ragazzi impresteresti del denaro?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister
A quale di questi ragazzi lasceresti frequentare tua sorella?
Ed Holleran
Rick Weinberg
Tom Studd
Burgermeister
Fine modulo
...ti arriveranno le seguenti risposte name/value.
Amico?..Ed=YES
Amico?..Rick=YES
Amico?..Tom=YES
Prestito denaro?...Tom=YES
Prestito denaro?...BM=YES
Affidare la sorella?...Ed=YES
Affidare la sorella?...Tom=YES
Affidare la sorella?...BM=YES
Non è grandioso!