VJEŽBA 8: OBRASCI
CILJ VJEŽBE: Učenik će moći oblikovati i primijeniti obrasce za prikupljanje podataka korisnika prilikom uređivanja sadržaja mrežnih stranica, učenik će razlikovati vrste elemenata koji čine obrazac i njihove atribute.
PRIPREMA:
1. Čemu služe obrasci na mrežnim stranicama?
Element obrazac spremnik je za različite vrste ulaznih elemenata kao što: tekstualna polja, potvrdni okviri, radio gumbi, gumbi za slanje.
2. Navedite primjere na najmanje pet vrsta podataka koji se mogu unositi na mrežnim stranicama
Tekstualna polja, potvrdni okviri, radio gumbi, gumbi za slanje, Submit potvrda unosa itd.
3. Navedite najmanje dva primjera za osjetljivost i moguće zloporabe podataka koji se unose na mrežnim stranicama
Može se dogoditi zlouporaba osobnih podataka prilikom unosa Broja telefona, Adrese, Imena i prezimena.
VJEŽBA:
ZADATAK 1. OBRASCI
A. Navedite najmanje pet primjera sa objašnjenjima za vrijednost atributa type.
B. Napišite HTML kod za obrazac koji će od korisnika tražiti da upiše ime i prezime u dva odvojena tekstualna polja. Uočite važnost međusobne povezanosti oznake “label” sa elementom “input” za “for”, “id” i “name”. Kolika je podrazumijevana dužina tekstualnog polja?
B. Napišite HTML kod za obrazac koji će od korisnika tražiti da upiše ime i prezime u dva odvojena tekstualna polja. Uočite važnost međusobne povezanosti oznake “label” sa elementom “input” za “for”, “id” i “name”. Kolika je podrazumijevana dužina tekstualnog polja?
ZADATAK 3. Elementi obrasca
A. Navedite bar pet različitih elemenata koje mogu sadržavati HTML elementi
Top of Form
Type, id, name, value, for
B. Proučite primjer i odgovorite čemu služe elementi fieldset i legend:
Fieldset služi kako bi se stvorio okvir oko obrasca. Fieldset se koristi za grupiranje podataka u bliku, a legenda definira naslov za element polja.
C. Proučite primjer i odgovorite čemu služi element datalist:
DATALIST element navodi popis unaprijed definiranih opcija za ulazni element.
D.Proučite primjer i odgovorite čemu služi element output:
Output element- izlazni element predstavlja rezultat izračuna.
ZADATAK 4.Tipovi ulaza
A.Navedite bar deset različitih tipova ulaza za atribut type. Koja mu je podrazumijevana vrijednost? Kako se ispisuje ako navedemo vrijednost „password“?
-Button, checkbox, color, date, datetime-local, email, file, hidden, image
-Vrijednost za password se ispisuje u obliku zvjezdica ****
B.Napišite kako se definira reset tipka koja sve vrijednosti unesene u obrazac resetira na njihove podrazumijevane vrijednosti.
<input type=“rest“>
C. Što će preglednik ispisati ako se za tip postavi vrijednost „color“?
Color nam daje da biramo boju.
D. Što će preglednik ispisati ako sa za tip postavi vrijednost „date“? Čemu služe atributi min i max?
DATE se koristi za biranje datuma
Min i max je minimum i maksimum datuma
E. Kako preglednik tretira tip „email“? Za koji će se tip preglednik ponašati slično?
Tretira kao polje za upis email adrese. Neki prijenosni uredaji dodaju .com kada prepoznaju email polje.
F. Što omogućuje tip „file“?
FILE koristi se za odabir datoteke- sadrži i browse
G. Kako ćete ispisati obrazac u kojem će biti dozvoljeno za količinu naručenih stvari unijeti samo brojke i to od 1 do 5?
Ispisati ćemo ga sa number i quantity (between 1 and 5)
H. Koji se tip može primijeniti za unos telefonskog broja?
Koristit ćemo <input type=“tel“>
ZADATAK 5. Atributi ulaza
A. Objasnite čemu služi atribut value.
VALUE navodi početnu vrijednost.
B.Objasnite čemu služi atribut maxlength.
MAXLENGHT je najveći dopušteni broj znakova u polju za unos
C.Objasnite čemu služi atribut required.
REQUIRED navodi da se polje mora ispunii prije slanja obrasca
