Da bi stvari bile preglednije, pisaću samo ono što se nalazi između <FORM> tagova. Izostavljaću HEAD, BODY, TITLE, FORM tagove. Ima li potrebe naglašavati - Vi to nemojte raditi, tj. pišite sve da bi sve radilo kako treba!
Najčešći tip (TYPE) obrasca <INPUT> je TEXT.
<INPUT TYPE=TEXT>
Svaki unos (INPUT) mora da ima ime (NAME).
<INPUT TYPE=TEXT NAME="ADDRESS">
Kada posetilac ukuca svoju adresu (npr. Bulevar Interneta 123), ona postaje vrednost unosa (input's value) i uparuje se sa ADDRESS, tako da je krajnji rezultat, nakon obrade, ADDRESS=Bulevar Interneta 123.
Ukoliko želimo, možemo odmah uneti vrednost (VALUE).
<INPUT TYPE=TEXT NAME="ADDRESS" VALUE="Zoranova ulica 10">
Ovo će automatski spojiti vrednost Zoranova ulica 10 sa imenom atributa ADDRESS, osim ako korisnik to ne izmeni. (Pažnja - obavezno stavljajte navodnike tamo gde su navedeni!)
Možemo odrediti veličinu polja za unos teksta.
<INPUT TYPE=TEXT NAME="ADDRESS" VALUE="Zoranova ulica 10" SIZE=10>
<INPUT TYPE=TEXT NAME="ADDRESS" VALUE="Zoranova ulica 10" SIZE=20>
<INPUT TYPE=TEXT NAME="ADDRESS" VALUE="Zoranova ulica 10" SIZE=30>
Kao što vidite, default vrednost je (obično) 20. Verovatno znate da je default (za one koji ne znaju - čita se difolt) ona vrednost koju će browser pretpostaviti ako nije zadata nijedna druga.
Pažnja - Polje za tekst (text box) nije uvek iste veličine, već se može razlikovati od browsera do browsera. Ovo je problem samo onda kada želite neki veoma precizan izgled web strane. Zapravo, preterano preciziranje bilo čega na web strani je samo početak problema!
Hajde da uklonimo vrednost (VALUE="Zoranova ulica 10").
<INPUT TYPE=TEXT NAME="ADDRESS" SIZE=30>
Ako to želimo, možemo da ograničimo broj unetih znakova. Primera radi, pokušajte da unesete više od 10 znakova u donje polje!
<INPUT TYPE=TEXT NAME="ADDRESS" SIZE=30 MAXLENGTH=10>
Ova funkcija može biti ponekad korisna, ali osim ako ne mislite da će Vam neko poslati ceo roman "Tihi Don", nema preterane potrebe za njenim korišćenjem.
Veoma sličan atributu TYPE=TEXT je atribut TYPE=PASSWORD. Zapravo, to je ista stvar, osim što će umesto pravog unosa biti prikazane zvezdice*****. Browser će Vam poslati prave podatke, samo ih neće prikazati.
<INPUT TYPE=PASSWORD>
Upamtite da svaki unos (<INPUT>) mora imati ime (NAME).
<INPUT TYPE=PASSWORD NAME="USER PASSWORD">
Atributi SIZE, VALUE, i MAXLENGTH važe i ovde. Uzgred, <TAG> govori browseru da uradi nešto. ATRIBUT ide unutar tage, i govori browseru kako da uradi ono što zapoveda tag.
Idemo dalje. Sledeće što ćemo naučiti jesu RADIO BUTTONS i CHECK BOXES. Osnovna razlika je ta što RADIO BUTTONS omogućavaju korisniku da izabere jednu od ponuđenih mogućnosti; CHECK BOXES, međutim, omogućavaju da se izabere jedna,
više ili sve ponuđene opcije.
Pogledajmo prvo Radio BUTTONS.
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG">
Dodajmo još dva.
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG">
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG">
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG">
Bilo bi mnogo bolje kada bi smo svaki radio BUTTON stavljali u novi red...
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG"><BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG"><BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG"><P>
Obratite pažnju na to svaki unos (input) ima isto ime. Razlog sledi uskoro.
Svakom Radio dugmetu mora biti dodeljena vrednost (VALUE).
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Pera"><BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Mika"><BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Đoka"><P>
Imenujmo sada svako dugme.
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Pera"> Pera Perić<BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Mika"> Mika Mikić<BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Đoka"> Đoka Đokić<P>
Pomoću HTML tagova moguće je promeniti izgled ovih naziva (boja, veličina, bold, itd).
U principu, ovim su Radio dugmići završeni. Možemo dodati npr. neko pitanje, i izabrati default odgovor (ovo je potpuno opciono)...
Ko ti je NAJBOLJI DRUG?<BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Pera" CHECKED> Pera Perić<BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Mika"> Mika Mikić<BR>
<INPUT TYPE=RADIO NAME="NAJBOLJI DRUG" VALUE="Đoka"> Đoka Đokić<P>
Korisnik, naravno, može da izabere samo jednu opciju. Njegov izbor biće Vam poslat kao kombinacija imena i vrednosti, npr. NAJBOLJI DRUG=Pera (ili ko već bude izabran).
Pređimo na CHECK BOXES. Počećemo ovako...
<INPUT TYPE=CHECKBOX NAME="Pera">
Dodajmo još tri kutijice, ali tako da svaka ima različito ime (NAME). (Ako želite, stavite svaku kutijicu u nov red.)
<INPUT TYPE=CHECKBOX NAME="ED"><BR>
<INPUT TYPE=CHECKBOX NAME="Mika"><BR>
<INPUT TYPE=CHECKBOX NAME="Đoka"><BR>
<INPUT TYPE=CHECKBOX NAME="Boža"><P>
Svaki Check Box ima istu vrednost - VALUE.
<INPUT TYPE=CHECKBOX NAME="ED" VALUE="YES"><BR>
<INPUT TYPE=CHECKBOX NAME="Mika" VALUE="YES"><BR>
<INPUT TYPE=CHECKBOX NAME="Đoka" VALUE="YES"><BR>
<INPUT TYPE=CHECKBOX NAME="Boža" VALUE="YES"><P>
Pažnja - Kod Check Boxeva menja se NAME, a VALUE se ne menja; međutim, kod Radio BUTTONa situacija je obrnuta - NAME je isto, dok se VALUE menja. Naravno, ne očajavajte, ni meni to nije baš jasno. Zato ja često koristim razna referentna dokumenta za HTML. (Mislili ste da sve to držim u glavi? :-))
OK, hajde da imenujemo svaki CHECK BOX.
<INPUT TYPE=CHECKBOX NAME="ED" VALUE="YES"> Pera Perić<BR>
<INPUT TYPE=CHECKBOX NAME="Mika" VALUE="YES"> Mika Mikić<BR>
<INPUT TYPE=CHECKBOX NAME="Đoka" VALUE="YES"> Đoka Đokić<BR>
<INPUT TYPE=CHECKBOX NAME="Boža" VALUE="YES"> Boža Božić<P>
Možemo dodati neko pitanje iznad ovoga i odabrati nekoliko predefinisanih odgovora (naravno, samo ako sve to smatrate potrebnim).
Ko su ti prijatelji od dole navedenih?<BR>
<INPUT TYPE=CHECKBOX NAME="ED" VALUE="YES" CHECKED> Pera Perić<BR>
<INPUT TYPE=CHECKBOX NAME="Mika" VALUE="YES"> Mika Mikić<BR>
<INPUT TYPE=CHECKBOX NAME="Đoka" VALUE="YES" CHECKED> Đoka Đokić<BR>
<INPUT TYPE=CHECKBOX NAME="Boža" VALUE="YES"> Boža Božić<P>
Korisnik sad može odabrati nijednu, jednu, dve, tri ili sve četiri opcije. Njihovi odgovori biće Vam poslati kao parovi imena i vrednosti...
Pera=YES
Đoka=YES
(ili šta je već odabrano... ukoliko ništa nije odabrano, to će Vam i biti poslato - ništa!)
A, šta ako... Šta ako želite da postavite tri različita pitanja o istoj grupi mladića? Kako to uraditi, gos'n Pametnjakoviću? - pitate se Vi.
Dobro, samo se smirite, pa ću Vam pokazati i to.
Istina je da u svakom obrascu ne bi trebalo da bude dupliranih imene (NAME). Dakle, možde smo trebali da koristimo različita imena u svakom pitanju. Naravno, ako koristimo ista imena, najviše što se može desiti je da se malo zbuni browser (Vaš PC sigurno neće tražiti azil u Zimbabveu samo zbog toga!).
Evo i HTML koda za prethodna tri pitanja. Tabelarni tagovi su plave boje. Njihova je funkcija čisto estetske prirode, i nikako ne utiču na sam obrazac. (Ako biste malo da osvežite svoje znanje o HTML tabelama, skoknite baš ovde.)
<CENTER>
<TABLE WIDTH=600 BORDER=1 CELLSPACING=1><TR>
<TD WIDTH=199>
Ko su ti prijatelji od dole navedenih?<BR>
</TD>
<TD WIDTH=200>
Kome bi pozajmio novac?<BR>
</TD>
<TD WIDTH=199>
Sa kime biste voleli da Vaša sestra izlazi?<BR>
</TD>
</TR></TABLE>
</CENTER>
Pretpostavimo da su ovo odgovori...
Takvi odgovori bi doveli do ovakvih parova imena i vrednosti (name/value).
Prijatelj?..Pera=YES
Prijatelj?..Mika=YES
Prijatelj?..Đoka=YES
Pozajmica?...Đoka=YES
Pozajmica?...Boža=YES
Sestrin izlazak?...Pera=YES
Sestrin izlazak?...Mika=YES
Sestrin izlazak?...Boža=YES
Super, zar ne!
| ||||||||