HTML Forms

11. Varijable

Sve što ste dosada naučili i nema baš nekog prevelikog smisla ukoliko ne proučite i narednu lekciju. Jer što vam vrijedi napraviti super, estetski obrazac ako se vaše varijable ne proslijede do skripte koja će ih dalje obraditi. Upravo to je i tema lekcije: Kako pravilno proslijediti varijable?
Već smo prije spomenuli da se naziv varijable određuje pomoću NAME atributa, a njezina vrijednost s VALUE. Na taj način se stvara par name="value" koji se prosljeđuje do skripte ili pak do mail klijenta (Outlook, Mozilla Messenger ...). Kako to sve djeluje u praxi te koje specifičnosti sve postoje možete saznati ukoliko pročitate naredna poglavlja i pogledate primjere.

GET protiv POST

Često puta ćete morati paziti kako i kada upotrebljavate GET i POST metode.

U naredna dva primjera obratite pažnju kako ćete u location tj. address baru kod GET metode moći vidjeti varijable koje prosljeđujete do skripte dok kod POST metode to neće biti slučaj.
GET primjer        Vidi source !
POST primjer        Vidi source !

Kada želimo da se podaci uneseni u obrazac prenesu u email client mora se upotrijebiti GET metoda. Pri tome se moraju kreirati dva input text polja. Naziv prvoga mora biti name="subject" te određuje naslov, a drugi mora biti name="body" i on određuje sadržaj poruke. Pogledajte naredna dva primjera!
GET primjer        Vidi source !
POST primjer        Vidi source !

JavaScript

Često puta će se podaci uneseni u vaš obrazac proslijediti do nekakve JavaScript skripte. Kako to sve izgleda možete pogledati ovdje -03javascript.html.
03javascript.html source
obrada.js source

Password polje će JavaScript prepoznati kao znakove, a ne kao zvijezdice. U narednom primjeru ćete moći vidjeti koji ste password (lozinku) upisali.
POST primjer        Vidi source !

Radio i checkbox

Kod RADIO opcija radi se o jednoj varijabli pa će se upotrijebiti isti naziv za sve opcije tj. name atribut će biti isti. To nam omogućava da od više istih stavki izaberemo samo jednu.
Pogledajte primjer i obratite pažnju kako je name="auto" isti za sve 3 opcije, a atribut value mu pridružuje različite vrijednosti.

Kod CHECKBOX opcija se radi o više različitih varijabli. Zato se moraju i različito imenovati s name atributima. To nam omogućava da izaberemo više različitih stavki.
Pogledajte primjer i obratite pažnju kako je name različit za sve 3 opcije, a atribut value im pridružuje različite vrijednosti.
Također postoji mogućnost da se upotrijebi isti name atribut za sva checkbox polja. U tom slučaju se varijable nižu u red varijabli tzv. Array pa će u JavaScriptu varijable biti document.forms[0].auto[0].value, document.forms[0].auto[1].value, document.forms[0].auto[2].value...
Kako izgleda niz varijabli ako se upotrijebi GET metoda pogledajte ovdje. Naime u location baru ćete vidjeti boja=plava&boja=zelena&boja=crvena.

File

Kod fajl polja naziv varijable definira se isto s name atributom. Vrijednost te varijable biti će put do fajla kojeg smo izabrali. Pogledajte primjer !!!

Hidden

Kao i kod ostalih vrsta polja tako i kod hidden polja naziv varijable definira se pomoću name, a njezina vrijednost s value atributom. Jedina razlika je u tome što nećemo moći mijenjati ovu varijablu.

Textarea

Varijabla textarea polja koristi se isto kao i kod input text polja. Veoma je zanimljivo ako se umjesto običnog texta unutar textarea tagova napiše nekakav HTML code. Uz malo umješnosti u JavaScriptu moći ćete generirati proizvoljne HTML dokumente.
Pogledajte primjer !     Pogledajte source primjera !

Također pripazite da između tagova i texta između nema razmaka jer će se razmak interpretirati kao prazan znak te će se kao takav prenijeti do skripte što ju može u konačnici čak i zbuniti. Dakle, treba pisati
<textarea>neki text</textarea> a ne <textarea>    neki text        </textarea> .
Pogledajte primjer !

Select

Već smo prije spomenuli da SELECT tag može imati dvojako ponašanje.
1. Najčešća je upotreba select taga kao radio dugmeta. U tom slučaju će postojati samo jedna varijabla (jedan name="value" par) jer ćemo moći izabrati samo jednu stavku. Pri tome neće biti većih problema u prosljeđivanju te jedne jedine varijable do skripte.
2. Ukoliko se upotrijebi atribut multiple select polje će se ponašati kao checkbox te će nam biti omogućen višestruki izbor stavki. Budući da će se name atribut upotrijebiti samo jednom (<select name="ime">) , a value će varijabli pridružiti više vrijednosti stvorit će se niz varijabli te će se tako proslijediti do skripte.
Pogledajte primjer !     Pogledajte source primjera !