Tutoriale html-Formulare

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..

.

Name:
.

Password:

.


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..

.

Name:
.

Password:
.

.


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..

.

Ce tip de pantofi porti ?
.

Culoare:
Inchis .

Deschis
.

Marime:
Mica.

Medie .

Mare
.

.


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..

.

Ce culoare de pantofi preferi ?

.

Negru simplu

Alb simplu

Nuante de gri

Alb cu negru
.

.


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..

.

Preferinte muzicale

Emo
Metal/Rock
Hip Hop
Ska
Jazz
Country
Classical
Alternative
Oldies
Techno

.


Vizualizare
Preferinte muzicale.

Emo Metal/Rock Hip Hop Ska Jazz Country Classical Alternative Oldies Techno .

.


.

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. .

.

Nivel de studii?

Alege
Scoala Generala
Liceu
Postliceala
Facultate
Doctorat
.

.


Vizualizare
Nivel de studii? Alege Scoala Generala Liceu Postliceala Facultate Doctorat .


--------------------------------------------------------------------------------

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..

.


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 . "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: .<br /><br />wrap= <br />- "off" <br />- "virtual" <br />- "physical".<br /><br />Vom insista mai mult pe explicarea acestor valori in tutorialul destinat campurilor de text .<br /><br /><form method="post" action="mailto:youremail@email.com"> <textarea rows="5" cols="20" wrap="physical" name="comments">.<br /><br />Scrie un comentariu .<br /><br /> .


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"