Formularul este unul dintre cele mai importante
unete folosite de un webmaster pentru a obtine informatii importante
despre un internaut, informatii precum email, nume, adressa, telefon sau
orice alte informaii.

In functie de necesitati infoarmatia poate
fi procesata si stocata intr-un fisier, se pot realiza statistici,
formulare de inscriere sau abonamente la informatia prezentata in pagina
ta si multe altele.
HTML - Campuri de text

Inainte sa intram
in detalii trebuie ar trebuii sa expunem putin bazele unui formular.
Campurile de text au cateva atribute care trebuiesc mentionate inca de
la inceput:

- type - Determina tipul campului de text. De exemplu: text, trimite, sau parola.
- name - Atribuie un nume campului pentru a pute face referire la el mai tarziu
- size - Seteaza marimea campului.
- maxlength - valoarea maxima de caractere ce pot fi introduse.

<form method="post" action="mailto:youremail@email.com">

Name: <input type="text" size="10" maxlength="40" name="name"> <br />

Password: <input type="password" size="10" maxlength="10" name="password">
</form>
Vizualizare
Name:
Password:

NU folosi acest cod. Datele din formular nu vor fi criptate si nu vor fi sigure din punct de vedere al securitatii.
HTML - Formular de email

Sa
adaugam acum si butonul de trimitere. In general, butonul de
"trimitere" ar trebuii sa fie ultimul si sa aibe atributul name definit
ca "Trimite". "Send", "Submit" sau ceva asemanator. Acest nume va fi
numele butonului.

Va trebui deasemenea sa specificam o destinatie
a datelor introduse in formular la fel ca si modul de transfer. Aceasta
se poate face agaugand urmatoarele atribute formularului./p>

- method - Vom folosi metoda "post". Aceasta trimite formularul cu informatia introdusa fara sa afiseze detalli userului.
- action - Acesta va fi folosit pentru a specifica URL-ul unde va fi trimisa informatia.

<form method="post" action="mailto:youremail@email.com">

Name: <input type="text" size="10" maxlength="40" name="name"> <br />

Password: <input type="password" size="10" maxlength="10" name="password"><br />

<input type="submit" value="Send"> </form>
Vizualizare
Name:
Password:

Trebuie doar sa schimbi adresa de e-mail cu una valabila pentru ca formularul sa functioneze corect.
HTML - Butoane Radio

Butoanele
Radio sunt foarte populare, utile si usor de folosit. Cel mai intalnit
exemplu a fi o intrebare cu multiple variante de raspuns. Atributele
care ar trebuii cunoscute sunt urmatoarele.

- value - specifica
ceea ce va fi trimis in cazul in care un user selecteaza un anume buton.
Doar o singura valoare va fi trimissa.
- name - decide carui set de butoane apartine butonul selectat.

<form method="post" action="mailto:youremail@email.com">

Ce tip de pantofi porti ? <br />

Culoare:
<input type="radio" name="culoare" value="inchis">Inchis

<input type="radio" name="culoare" value="deschis">Deschis <br />

Marime:
<input type="radio" name="marime" value="mica">Mica

<input type="radio" name="marime" value="medie">Medie

<input type="radio" name="marime" value="mare">Mare <br />

<input type="submit" value="Email Myself"> </form>
Vizualizare

Ce tip de pantofi porti ?
Culoare: Inchis Deschis
Marime: Mica Medie Mare

In cazul in care vei inlocuii adresa de email cu a ta vei primi un email cu: "marime=(alege) culoare=(alege)".
HTML - Checkbox

Cu
ajutorul CheckBox-urilor userul are posibilitatea de a alege unul, doua
sau mai multe variante de raspuns. Atributele name si value se folosesc
la fel ca si pentru butoanele radio.

<form method="post" action="mailto:youremail@email.com">

<p>Ce culoare de pantofi preferi ? </p> <p>

<input type="checkbox" name="pantofi" value="negru">Negru simplu <br/>
<input type="checkbox" name="pantofi" value="alb">Alb simplu <br/>
<input type="checkbox" name="pantofi" value="gri">Nuante de gri <br/>
<input type="checkbox" name="pantofi" value="alb negru ">Alb cu negru <br/>

<input type="submit" value="Email Myself"></p> </form>
Vizualizare

Ce culoare de pantofi preferi ?

Negru simplu
Alb simplu
Nuante de gri
Alb cu negru
HTML - Alte tipuri de formulare de liste

Un
alt model de formular tip lista este urmatorul, in care userul
selecteaza o anumita linie care va fi trimisa ca si optiunea aleasa.

<form method="post" action="mailto:youremail@email.com">

Preferinte muzicale
<select multiple name="music" size="4">
<option value="emo" selected>Emo</option>
<option value="metal/rock" >Metal/Rock</option>
<option value="hiphop" >Hip Hop</option>
<option value="ska" >Ska</option>
<option value="jazz" >Jazz</option>
<option value="country" >Country</option>
<option value="classical" >Classical</option>
<option value="alternative" >Alternative</option>
<option value="oldies" >Oldies</option>
<option value="techno" >Techno</option>
</select>
<input type="submit" value="Email Yourself"> </form>
Vizualizare

Preferinte muzicale



Un
alt model de formular este meniul "dropdown". Acesta va fi afisat ca si
un camp, care va afisa o lista atunci cand este executat un clik asupra
lui.

<form method="post" action="mailto:youremail@email.com">

Nivel de studii?
<select name="studii">
<option>Alege</option>
<option>Scoala Generala </option>
<option>Liceu</option>
<option>Postliceala</option>
<option>Facultate</option>
<option>Doctorat</option>
</select>

<input type="submit" value="Email Yourself">

</form>
Vizualizare

Nivel de studii?
HTML - formular de upload

Mai
intai de toate trebuie mentionat ca acest formular este doar interfata,
partea vizibila cu care un user va putea interactiona.. Pentru a face
un formular complet de upload sunt necesare cunostinte de PHP si PERL
iar javascriptul este si el binevenit.

Un formular de upload este
compus din mai multe parti. Vom incepe prin a stabili marimea
fisierului pe care il vom uploada. Acest lucru se face cu ajutorul unui
cam ascuns. In continuare vom crea campul propriu-zis in care userul va
putea scrie adresa fisierului sau pur si simplu sa sa dea browse pentru a
deschide o fereastra windows explore.

<input type="hidden" name="MAX_FILE_SIZE" value="100" /> <input name="file" type="file" />
Vizualizare
HTML - Zone de text, Comentarii

In
general zonele de text sunt foosite pentru a trimite comentarii.
Blogurile si forumurile sunt principalele tipuri de pagini web care
folosesc aceste optinui. Totusi exista multe alte tipuri de situri care
folosesc zonele de text pentru a afla parerea userilor despre un anumit
aspect.

Pentru a crea o zona de text vom specifica mai intaii
atributele rows si cols in interiorul tag-ului <textarea>. "Rows"
va stabilii innaltime campului in linii de caractere iar "cols" lungimea
unei linii in caractere. In exemplul urmator exista 5 linii a cate 20
de caractere. De asemenea strebuie specificat unul dintre atributele
tagului wrap, acestea sunt:

wrap=
- "off"
- "virtual"
- "physical"

Vom insista mai mult pe explicarea acestor valori in tutorialul destinat campurilor de text

<form
method="post" action="mailto:youremail@email.com"> <textarea
rows="5" cols="20" wrap="physical" name="comments">

Scrie un comentariu

</textarea> <input type="submit" value="Email Yourself"> </form>
Vizualizare
Scrie un comentariu

Deasemenea
trebuie specificat ca ceea ce vei scrie intre tagul de deschidere si
cel de inchidere va apare in interiorul zonei de text. In acest caz a
fost folosita o invitatie predefinita: "Scrie un comentariu"