Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Formularele HTML sunt folosite pentru a selecta

diferite moduri de introducere a datelor de ctre
utilizator.
Un formular poate conine:

cmpuri text i parole

csue de validare
butoane radio
liste de selecie
butoane de tip Submit i Reset
cmpuri de editare
casete de fiiere

Un formular se defineste cu tagul <form>.

Opional Informatic-Formulare HTML
Grupul colar "Ion Nistor"

Cmpuri de text i parole

<input type="text" >

<input type="password" >

pentru cmpuri text

pentru cmpuri parol

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Cmpuri de text i parole

<form>
<input type="text >
<br>
<input type="password" >
</form>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Cmpuri de text i parole

<form>
<b>Nume</b> <input type="text">
<br>
<b>Parola</b> <input type="password">
</form>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Csue de validare(checkbox)

Se pot selecta mai multe valori

<input type="checkbox">

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Csue de validare(checkbox)
<form>
<input type="checkbox" > Am un caine
<br>
<input type="checkbox" > Am o pisica
<br>
<input type="checkbox" > Am un porumbel
</form>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Butoane radio

Se poate selecta o singur valoare

<input type="radio name=nume>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Butoane radio
<form>
Sex: <input type="radio" name=sex> Masculin
<input type="radio" name=sex> Feminin
</form>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Listele de selecie

Se selecteaz o valoare dintr-o list de valori

<select>
<option value=valoare1>valoare1</option>
<option value=valoare2>valoare2</option>

</select>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

10

Listele de selecie
<form>
<select>
<option value="Suceava">Suceava</option>
<option value="Arad">Arad</option>
<option value=Timisoara>Timisoara</option>
<option value=Bucuresti>Bucuresti</option>
</select>
</form>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

11

Butoane de tip Submit i Reset

Folosite pentru a trimite, respectiv reseta datele dintr-un

formular

<input type="submit" value="Trimite">

<input type="reset value=Sterge">

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

Submit
Reset

12

Butoane de tip Submit i Reset

<form>
<input type="submit" value="Trimite">
<input type="reset" value="Sterge">
</form>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

13

Cmpuri de editare

<textarea cols=c" rows =r name=nume"></textarea>

am folosit atributul cols pentru a stabili numrul de caractere

al fiecarui rand, atributul rows pentru numarul de randuri al
campului de editare

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

14

Cmpuri de editare
<form>
<textarea cols="50" rows ="5 name="exemplu"></textarea>
</form>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

15

Casete de fiiere

Pentru a trimite un fisier prin intermediul unui

formular

<input type="file" >

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

16

Casete de fiiere
<form>
Incarca o fotografie <input type="file" name="file">
</form>

Opional Informatic-Formulare HTML

Grupul colar "Ion Nistor"

17