Tag TEX BOX elementa forme kao što vidimo u kodu je . Brauzer kad naidje na taj tag odma iscrtava polje za popunjavanje.
Atribut NAME u TEXT BOX-u je obavezan i njegovu vrednost dajemo po želji.
Atribut VALUE nije neophodan. Ukoliko se ne ubaci a mi napišemo nešto u polje i kad kliknemo na submit dugme forma automatski to što smo napisali dodeljuje u vrednost VALUE. Medjutim ako ipak želimo da mu damo vrednost (kao što smo mi dali) onda je to defoltna vrednost koja će se proslediti kada kliknemo na submit dugme iako ništa nismo upisali. Ako nismo napisali VALUE vrednost a i ne napišemo ništa a kliknemo submit dugme onda će se u value dodeliti prazan string i tako poslati na dalju obradu.
E sada slede atributi textbox-a koji nisu obavezni ali su zanimljivi naravno.
SIZE je numerički atribut koji definiše širinu polja po horizontali mereno u tekstualnim znacima. Na primer SIZE = 10 definiše da će 10 znaka biti veličina prozorčića u kome će se pisati. Drugim rečima ovim atributom definišemo veličinu prozorčića.
MAXLANGTH je isto numerički atribut.koji definiše maksimum slova koliko možemo da pišemo u prozoče. Na primer MAXLANGTH = 8 znači da možemo maksimalno 8 slova pisati u prozorče, a kad ispišemo 8 slova više nemožemo jer iako mi i dalje kucamo slova na tastaturi slova se više ne ispisuju. Obično ide zajedno sa SIZE atributom, ali tako da vrednost u size atributu uvek bude za dva ili tri veća od MAXLANGTH vrednost. Naravno MAXLANGTH nemojte nikad shvatiti kao sigurnu zaštitu. Već smo pisali da se na klijentskoj strani svaka zaštita može izigrati. Ali pošto ima daleko više običnih korisnika od militantnih sve ovo ipak ima smisla jer se rasterećuje server tako što se još na klijentskoj strani definiše veličina teksta.
Submit button
Submit button (submit dugme) je obavezno u svim formama jer se na njega klikne kad je sve popunjeno da bi forma poslala podatke. Zato sam ja dao vrednost POSALJI. Submit button je isto element forme. Njegov tag je koji uvek sadrži atribut VALUE osim ukoliko želite da vam se na dugmetu ispiše Submit Query. Vrednost VALUE atributa je znači tekst koji će se prikazivati na dugmetu. SUBMIT tag mora da sadrži atribut NAME ukoliko forma šalje podatke nekoj skripti za obradu podataka, na primer PHP skripti. Vrednost atributa NAME se naravno ne vidi u brauzeru, ali se vrednost imena šalje skriptama kao što su PHP kojima je to neophodno. Ako koristimo formu samo u JavaScript-ovima onda nije neophodno imenovati submit dugme.
Image button
Image button može da zameni submit dugme i besmisleno je da se zajedno nadju u istoj formi jer vrše istu funkciju. Naime priča je vrlo slična kao i za submit, samo što IMAGE dugme nema VALUE atribut a ima atribute koji su vezani za slike. Evo jednog IMAGE BUTTON taga pa će sve biti jasnije:
Znači kad se klikne na IMAGE dugme forma šalje podatke. E sad kao što vidimo postoji i SRC argument a on kao što znamo daje kratko objašnjenje slike ako se ona iz nekog razloga ne pojavi. Znači važe svi argumenti koje smo naučili u vezi slika da se ne ponavljamo. Jedino treba naglasiti da je poželjno uvek koristiti ALT argument obzirom da nekad može se desiti da se ne pojavi slika pa da ljudi znaju gde je submit dugme. Takodje NAME argument uvek mora da se koristi ako forma šalje na primer PHP skriptama podatke, a ako šalje JavaScript-u onda nije neophodno.
Reset
Reset dugme nije obavezno ali se u ogromnoj većini formi koristi. Reset dugme se klikće kad želimo da izbrišemo sve šta smo uneli u polja forme, na primer zato što smo pogrešili na više mesta pa se više isplati da sve ponovo popunimo. Reset dugme ima tag koji uvek sadrži atribut VALUE osim ukoliko želite da vam se na dugmetu ispiše Reset. Vrednost VALUE atributa je tekst koji će se prikazivati na dugmetu u brauzeru.
Password Field
Password field je apsolutno u svemu isti kao i TEXTBOX samo što se ovde pojavljuju tačkice dok pišemo u prozorče a u texbox-u se pojavljuju slova koja pišemo. Znači ovde se isto pamte u VALUE atributu ono što zapišemo ali vizuelno vidimo tačkice kao zaštita šifre da neko ko posmatra sa strane ne vidi šifru. Tag ovog atributa je . Ponavljam još jednom, sve ostalo je apsolutno isto kao kod textbox-a.
Hidden Field
U nekim slučajevima forma mora pored podataka koje unose posetioci da pošalje i odredjene podatke koje ne unose posetioci i nisu im vidljivi. Na primer neki sajt ima englesku i srpsku verziju. I recimo iz obe verzije forme šalju podatke istoj skripti na obradu. E sad da bi ta skripta znala iz koje verzije su podaci, možemo kroz HIDDEN polje da prosledimo na primer vrednost engleski, ili srpski. Ali nemojte zaboraviti da je taj podatak sakriven u smislu da se ne vidi u direktno u displeju brauzera, ali ako neko želi može ga videti. Na primer pogleda Source code vaše stranice pomoću brauzera.
HIDDEN tag je . A kompletan FORM tag bi izgledao ovako:
Top of Form
Upisi svoje ime:
Bottom of Form
Iz primera jasno uočavate da se TEXT BOX vidi a HIDDEN polje ne. Kad se unese ime u našem primeru i klikne na POSALJI forma šalje ime, ali šalje i vrednost iz HIDDEN atributa iako ga posetioc nije uneo a ni video. HIDDEN tag uvek mora da sadrži VALUE i NAME atribute i da im bude dodeljena vrednost. HIDDEN tag ima samo NAME I VALUE atribute.
Hidden Field
U nekim slučajevima forma mora pored podataka koje unose posetioci da pošalje i odredjene podatke koje ne unose posetioci i nisu im vidljivi. Na primer neki sajt ima englesku i srpsku verziju. I recimo iz obe verzije forme šalju podatke istoj skripti na obradu. E sad da bi ta skripta znala iz koje verzije su podaci, možemo kroz HIDDEN polje da prosledimo na primer vrednost engleski, ili srpski. Ali nemojte zaboraviti da je taj podatak sakriven u smislu da se ne vidi u direktno u displeju brauzera, ali ako neko želi može ga videti. Na primer pogleda Source code vaše stranice pomoću brauzera.
HIDDEN tag je . A kompletan FORM tag bi izgledao ovako:
Top of Form
Upisi svoje ime:
Bottom of Form
Iz primera jasno uočavate da se TEXT BOX vidi a HIDDEN polje ne. Kad se unese ime u našem primeru i klikne na POSALJI forma šalje ime, ali šalje i vrednost iz HIDDEN atributa iako ga posetioc nije uneo a ni video. HIDDEN tag uvek mora da sadrži VALUE i NAME atribute i da im bude dodeljena vrednost. HIDDEN tag ima samo NAME I VALUE atribute.
Radio Button
RADIO BUTTON služi da posetilac izabere čekiranjem samo jednu od nekoliko ponudjenih opcija. Evo kompletnog koda i sve će biti jasnije:
Top of Form
Ko ti je najbolji drug? PERA
MIKA
ACA
Koja ti je boja kose? BELA
CRNA
PLAVA
Bottom of Form
Osnovni tag je kao što vidimo . Takodje vidimo u kodu da svaka ponudjena opcija ima svoj RADIO tag. Svaki RADIO tag obavezno mora sadržati NAME i VALUE atribute. U istoj formi u primeru su ponudjena dva tipa opcija. Prvi tip opcija je koje najbolji drug, a drugi tip opcija je koju boju kose ima posetilac. U svaka od ta dva tipa opcija bira se čekiranjem jedna opcija od ponudjenih tri. Na primer po defaultu smo stavili da je PERA najbolji drug, ali ako čekiramo MIKA onda se automatski briše čekiranje PERE.
U NAME atributu svih RADIO tagova koji se odnose na jedan tip opcija pišete obavezno istu vrednost. Za opcije na pitanje koje najbolji drug za NAME atribut svih RADIO tagova izabrali smo za vrednostdrug. A za opcije na pitanje koja je boja kose za NAME atribut svih RADIO tagova izabrali smo vrednost kosa.
Vrednosti VALUE atributa svih RADIO tagova unutar istog tipa opcija mora da se naravno medjusobno razlikuju kako bi se opcije programski razlikovale..
CHECKED je atribut RADIO taga bez vrednosti, a definiše defaultno čekiranje koja se automatski pojavi. Naravno CHECKED ako ga već imamo onda u jednom tipu opcija može da postoji najviše jedan CHECKED. Ako pogrešimo i stavimo na više mesta u jednom tipu opcija onda će brauzer konstatovati onaj CHECKED kojeg zadnjeg primeti. A ako želimo da ne bude automatskog čekiranja onda svuda izbacimo CHECKED.
A vezano za forme u ovom primeru možete primetiti da smo koristili tabelu za grafičko organizovanje pojedinih elemenata forme. Znači to je ono što sam pisao da unutar forme možete pisati po potrebi sve moguće tagove koje smo naučili. Jedino ne može se umetati forma unutar druge forme !! Na primer tabela u tabeli može ali ne i forma u formi.
Check Box
CHECK BOX ima cilj odabiranja ponudjenih opcija čekiranjem slično kao i RADIO BUTTON ali stom razlikom da omogućava čekiranje jedne ili više, pa i svih ponudjenih opcija. Osnovni tag je . A evo forme koja dočarava korišćenje ovog elementa forme:
Top of Form
Koje sve mlečne proizvode voliš?
MLEKO
MASLAC
SIR
Bottom of Form
Takodje i ovde vidimo u kodu da svaka ponudjena opcija ima svoj CHECKBOX tag. Svaki CHECKBOX tagobavezno mora sadržati NAME i VALUE atribute.
Svi NAME atributi u svim CHECKBOX tagovima moraju imati različitu vrednost. Zato i nema smisla postojanja više tipova opcija kao u slučaju RADIO taga jer svaki CHECKBOX tag ima drugačiju vrednost u NAME tagu. Da pogrešno ne shvatite, možete vi praviti više tipova opcija što se tiče posetilaca ali programski postoji jedan tip opcija za jednu formu.
Vrednosti VALUE atributa svih CHECKBOX tagova se naravno moraju medjusobno razlikovati kako bi se opcije i programski razlikovale.
CHECKED je atribut i CHECKBOX taga kao i kod RADIO taga ali za razliku od RADIO taga gde se stavlja samo jedan CHECKED atribut u jednom tipu opcija, ovde možete stavljati koliko god hoćete, pa i sve opcije ako želita mogu biti po defaultu čekirane.
Drop down menu
DROP-DOWN element forme ima istu funkciju izbora jedne opcije od ponudjenih kao što to omogućava RADIO BUTTON. Medjutim razlika je u broju ponudjenih opcija. Radio button elementom možemo ponuditi nekoliko opcija, dok drop-down menu elementom možemo ponuditi veliki broj opcija, na primer dvadeset ili čak i preko sto. Mi možemo preko RADIO tag ponuditi i trideset opcija ali zamislite tu situaciju, to bi bilo jako ružno na stranici. Daću sad kod a zatim objasniti:
Top of Form
Ko je najbolji tvoj drug?
Bottom of Form
Osnovni tag je . Kao što vidimo SELECT tag ima početni i krajnji tag, a izmedju se nalaze opcije koje se definišu pomoću OPTION taga, koji takodje ima početni i krajnji tag:.
Imenovanje drop-down menija je obavezno a NAME atribut se nalazi u SELECT tagu.
Takodje je i VALUE obavezan argument ali on se nalazi u OPTION tagu. Naravno vrednosti u VALUE atributu se medjusobno razlikuju.
U OPTION tagu može se naći i SELECTED atribut (koji nema vrednost) koji odredjuje koja opcija će biti na prvom mestu. Ako selected nije postavljen u ni jednom OPTION tagu onda je na prvom mestu ona opcija koja je na prvom mestu i u kodu. Ako ne izaberemo prilikom popunjavanja forme ništa onda forma šalje onu vrednost iz taga OPTION u kome se nalazi atribut SELECTED. Ako nigde ne figuriše SELECTED onda forma šalje vrednost iz prvog taga u kodu. Znači u ovom slučaju nije moguće poslati prazan string kao što može to RADIO BUTTON ukoliko nigde nije postavljen CHECKED atribut. Medjutim ako imamo potrebe za praznim stringom u slučaju da posetilac ništa ne izabere možemo napraviti jedan ovakav OPTION tag: i staviti ga na prvom mestu u kodu, stim da nakon toga nigde nesme da se nadje SELECTED argument.
E sad postoje dva argumenta koji se mogu naći u SELECTED tagu koji su čisto grafičke prirode. Naime po defaultu svi brauzeri iscrtavaju prozorče u kome se ispisuje (vidi) samo jedna opcija a sa desne strane se nalazi strelica (tačnije trouglić koji je okrenut na dole). E sad ako hoćemo na primer da se vide dve, tri ili koliko god želimo opcije a ne samo jedna onda SELECT tag stavimo SIZE atribut ovako: . U ovom slučaju će se videti SASA, ali i PERA i DRAGO iz prve. Naravno ako kliknemo na strelicu onda će se otvoriti neposredno ispod ili iznad prozorče sa ostalim opcijama. A ukoliko imamo mnogo opcija onda će se u prozorče pojaviti sa desne strane i klizač kojim možemo videti sve opcije. E sad ukoliko želimo da nam se odma pojavi to prozorče sa eventualnim klizačem bez prethodnog kliktanja strelice onda pišemo atribut MULTIPLE (koji nema vrednost).
File upload
File upload je element forme koji se koristi za ubacivanje fajlova, na primer slika, video klipova, tekst fajlova, i ostalih tipova fajlova. Daću kod pa ću onda objasniti:
Top of Form
UBACI SLIKU:
Bottom of Form
Form tag što se tiče ubacivanja fajlova UVEK mora sadržati method="POST", enctype="multipart/form-data" i action sa adresom fajla u kome se obradjuje uneti fajl. ACCEPT atribut može ali i ne mora da se ubacuje, i nećemo ga objašnjavati jer smo to već uradili kad smo objašnjavali FORM tag.
Uvek ali uvek u formi za upload fajlova morate staviti HIDDEN tag ako prosledjujete podatke PHP skripti. U hidden tag obavezno moramo staviti atribut name="MAX_FILE_SIZE"i value="20480".Value atribut odredjuje maksimalnu veličinu fajla koji može da se ubaci. Naravno to je da se server ne opterećuje ali nikako to ne shvatite kao zaštitu od prevelikog unosa. Zažtitu morate napraviti na strani servera u skripti za obradu podataka. U ovom našem slučaju maksimalna veličina fajla je 20 Kb a dobija se 20 * 1024 = 2048. Naravno ako želimo veću sliku u bajtima pišemo kako nam odgovara, ili manju.
E sad konačno o FILE UPLOAD tagu. Znači osnovni tag se piše . FILE tag nema VALUE atribut jer je vrednost u stvari sam fajl koji se ubacuje, a NAME vrednost odredjujemo kako nama odgovara. U FILE UPLOAD tag možemo ubaciti i SIZE atribut koji definiše veličinu prozorčića.