Formularele HTML (forms) au fost introduse
pentru realizarea unei mai mari interactiviati cu vizitatorul site-ului Web. Utilizand formulare se pot culege mai
usor informatii cu privire la vizitator si la preferintele
si dorintele acestuia, informatii ce urmeaza a fi preluate
si prelucrate de aplicatii aflate 'in spatele' paginii
(aplicatiile acestea se numesc, generic, scripturi CGI - Common Getway Interface - si
ruleaza pe serverul ce gazduieste pagina Web). De exemplu,
vizitatorul unui site ce ofera spre vanzare anumite produse va trebui
sa completeze un formular de comanda. Scriptul CGI preia datele din
formular, le prelucreaza (include vizitatorul in baza de date a
clientilor firmei, de exemplu) si creeaza un document de
raspuns (document Html sau mesaj E-mail prin care clientul este
anuntat despre receptionarea comenzii,
data limita
de onorare a acesteia, e.t.c).
Foarte multe site-uri ofera
posibilitati de cautare a informatiilor pe Web (cautatoare
Web). Vizitatorul precizeaza domeniul sau tema care-l intereseaza
intr-o rubrica (un 'textbox') si apasa un buton pentru a
porni cautarea. Mecanismul de cautare se realizeaza prin
aplicatii complexe, dar interfata cu utilizatorul este bazata pe
formulare Html
Inserarea
formularelor intr-un document web se realizeaza in mai multe etape:
proiectarea formularului de intrare, care va fi
completat de vizitator;
scrierea
aplicatiei care va prelucra informatiile din formular;
proiectarea
documentului-raspuns generat de scriptul CGI (raspuns la cererea
adresata prin completarea formularului);
Descrierea unui formular se face in interiorul marcajului
Atributele acestui marcaj sunt:
Action: stabileste ce anume se va intampla cu
datele scrise in formular. Ca valoare a acestui atribut se poate
specifica:
URL-ul
unui script CGI, aflat, de obicei, in directorul cgi-bin de pe
serverul WWW local (cel care contine pagina respectiva)
Action='mailto:adresa_de_mail': specifica faptul ca datele din
formular vor fi trimise prin posta electronica la adresa data;
acestea pot fi prelucrate ulterior, eventual 'manual';
Method: specifica metoda utilizata de
server pentru a trimite datele din formular scriptului specificat in atributul
Action. Valorile posibile sunt POST si GET .
Formularul poate
contine unul dintre urmatoarele elemente (sunt elemente care se intalnesc
si in interfata Windows):
campuri de text(text) = permit scrierea unui
text pe unul sau mai multe randuri;
liste (select)= permit selectarea unei
optiuni dintr-o lista;
butoane radio(radio buttons) = permit
selectarea unei singure optiuni dintre cele disponibile;
casute
de selectie(check box)= permit selectarea unuia sau mai multor
optiuni
parola(password) = asemanator campurilor de
text, dar caracterele care apar pe ecran sunt asteriscuri; folositor
pentru introducerea unei parole;
Marcajul INPUT
Marcajul <Input> poate fi
utilizat in conjunctie cu urmatoarele atribute:
Type='tip_element'
- specifica tipul elementului de formular care se utilizeaza
si care poate fi unul dintre urmatoarele:
text - caseta de text;
radio
- buton radio;
checkbox
- casuta de validare;
button
- buton de comanda;
submit
- buton de comanda special, care determina trasmiterea datelor
din formular catre server;
reset -
restaureaza valorile initiale din campurile formularului;
image
- permite inlocuirea unui buton de comanda cu o imagine
specificata;
password
- caseta de text in care, in locul caracterelor introduse sunt
afisate asteriscuri;
hidden
- camp ascuns;
Name='nume' - numele simbolic al
valorii campului, folosit de obicei in cadrul scripturilor, pentru a
identifica respectivul element (este de preferat ca oricarui element
din formular sa-i asociem un unic nume);
Value='valoare' - pentru tipul text
specifica textul afisat implicit, iar pentru butoanele radio si
casutele de validare reprezinta valoarea trimisa serverului daca
utilizatorul selecteaza acest buton.
Checked
- precizeaza daca butonul radio/casuta de validare a
fost selectata de vizitator.
Size='marime'
- numarul de caractere al casutei de text afisate;
Maxlength='marime'
- specifica numarul maxim de caractere acceptat in casuta de
text;
Marcajul TEXTAREA
Acest marcaj a fost creat pentru ca vizitatorul
sa poata introduce un text de lungime mai mare, care se intinde pe
mai multe randuri. Atributele specifice acestui marcaj sunt:
Cols=numar_coloane
- specifica lungimea unui rand in caractere;
Rows=numar_linii - specifica
numarul de randuri;
Wrap=off/soft/hard
- specifica modul de transmitere al continutului catre
scriptul CGI;
Marcajul <SELECT>
Marcajul
<Select> este un marcaj container ce introduce meniuri derulante de
optiuni. Atributul Size=numar indica numarul optiunilor
prezente in meniu. Fiecare optiune este inserata cu ajutorul
marcajului <Option></Option>. Apare si atributul Multiple
care permite selectarea mai multor optiuni din lista.
Iata un exemplu de caseta
combinata:
Ce parere aveti
despre pagina aceasta ?
Sursa HTML a exemplului este:
Urmarind
sursa de mai sus trebuie sa facem urmatoarele observatii:
Nu
este obligatoriu sa inchidem marcajul <Option>
Valoarea
asociata fiecarei optiuni prin atributul Value este valoare ce va
fi transmisa scriptului CGI prin trimiterea formularului.
Anumite
optiuni pot fi selectate implicit; marcajul<Option>
corespunzator va contine atributul Selected. Selectarea
mai multor optiuni se poate face doar daca a fost folosit
atributul Multiple in conjunctie cu marcajul <Select>.
Urmatorul
exemplu de formular Html contine cele mai utilizate elemente de formular.
Alinierea elementelor in pagina a fost posibila utilizand un tabel:
