Obrasci su dizajnirani za slanje podataka od korisnika na web server. Obrasci u HTML-u mogu se sastojati od tekstualnih polja i tekstualnih oblasti, okvira za potvrdu i radio dugmadi i padajućih lista. Sve su to elementi forme. Svaki element služi za prenošenje neke vrijednosti na stranicu.
U svojoj srži, HTML obrazac je web stranica na kojoj vidite područja za unos vaših informacija. Nakon što popunite formular i kliknete na dugme za slanje, informacije iz obrasca se pakuju i šalju na web server na obradu od strane serverske skripte (fajl rukovaoca). Nakon obrade, druga web stranica vam se vraća kao odgovor. Sljedeća slika jasno pokazuje kako obrazac funkcionira:
Nema ništa teško u kreiranju HTML obrazaca. Najlakši način da dobijete ideju o obrascima je da raščlanite malo HTML koda, a zatim vidite kako funkcionira. V sljedeći primjer prikazuje sintaksu za kreiranje jednostavnog HTML obrasca:
Primjer: Jednostavan HTML obrazac
- Probajte sami"
Moj prvi obrazac:
ime:
Prezime:
Element
Obrasci se ubacuju u web stranice kroz element . To je kontejner za sav sadržaj obrasca, uključujući elemente kao što su tekstualna polja i dugmad, kao i sve druge oznake. HTML jezik. Međutim, ne može sadržavati drugi element.
.
Za slanje obrasca na server koristi se dugme "Pošalji", isti rezultat će se dobiti ako se pritisne tipka "Enter" unutar obrasca. Ako na obrascu nema dugmeta Pošalji, za slanje se može koristiti taster Enter.
Većina atributa elementa utiču na obradu obrasca, a ne na njegov dizajn. Od kojih su najčešći akcija i metoda. Atribut akcija sadrži URL na koji će informacije u obrascu biti dostavljene na obradu od strane servera. Atribut metoda je HTTP metoda koju bi pretraživači trebali koristiti za slanje podataka obrasca.
Element
Skoro sva polja obrasca kreiraju se pomoću elementa (od engleskog input - unos). Izgled element mijenjaju ovisno o vrijednosti njegovog atributa tip:
Evo nekih vrijednosti atributa tip:
Unos teksta i lozinke
Jedan od mnogih jednostavni tipovi element forme je tekstualno polje dizajnirano za unos teksta iz jednog reda. Ovaj tip unos teksta je postavljen prema zadanim postavkama, i stoga će se prikazati polje u jednom redu ako zaboravite navesti atribut tip. Da biste u obrazac dodali polje za unos teksta u jednom redu, trebate unutar elementa atribut registra tip sa tekstualnom vrijednošću:
Polje za unos lozinke je varijacija uobičajenog tekstualno polje. Podržava iste atribute kao tekstualno polje u jednom redu. Atribut ime postavlja naziv polja za unos lozinke koje će biti poslato na server zajedno sa lozinkom koju je unio korisnik. Da biste kreirali polje za unos lozinke, morate postaviti vrijednost atributa lozinke tip(lozinka (engleski) - lozinka):
Primjer kreiranja obrasca sa poljem za lozinku:
Primjer: Polje Lozinka
- Probajte sami"
Vaša prijava:
Lozinka:
Uz ovaj atribut, možete koristiti i atribut maxlenght, čija vrijednost određuje maksimalni iznos znakova koji se mogu unijeti zadata linija. Također možete postaviti dužinu polja za unos pomoću atributa veličina. Prema zadanim postavkama, većina pretraživača ograničava tekstualna polja na 20 znakova. Za kontrolu širine novih elemenata obrasca, umjesto atributa veličina, preporučujemo korištenje kaskadnih stilskih tablica (CSS).
Atribut vrijednost specificira vrijednost koja se po defaultu prikazuje u tekstualnom okviru kada se obrazac učita. Unošenjem zadane vrijednosti u polje možete objasniti korisniku koje tačno podatke i u kojem formatu želite da korisnik ovdje unese. Ovo je kao uzorak, jer je korisniku mnogo zgodnije da popuni obrazac, videći primjer ispred sebe.
Prekidači (radio)
Element tip radio kreira radio dugmad koji koriste logički princip "ILI", omogućavajući vam da odaberete samo jednu od nekoliko vrijednosti: ako odaberete jednu poziciju, sve ostale postaju neaktivne. Osnovna sintaksa elementa radio dugmeta je:
Atribut ime za prekidače je potrebno i svira važnu ulogu u kombinovanju nekoliko elemenata radio dugmeta u grupu. Da biste kombinirali radio dugmad u grupu, morate podesiti istu vrijednost atribut ime i drugačije značenje atribut vrijednost. Atribut vrijednost postavlja vrijednost odabranog radio dugmeta za slanje na server. Vrijednost svakog elementa radio dugmeta mora biti jedinstvena unutar grupe tako da server zna koju opciju odgovora je korisnik odabrao.
Prisustvo atributa provjereno(sa engleskog - postaviti) na elementu prekidača označava koja od predloženih opcija treba biti odabrana po defaultu prilikom učitavanja stranice, ako je potrebno. Ovaj atribut može se podesiti samo na jednom prekidaču iz grupe:
- Probajte sami"
Koliko imaš godina?
- ispod 18
- od 18 do 24h
- od 25 do 35
- preko 35
atribut akcije.
Glavni za element je atribut akcija A koji specificira rukovaoca podacima za obrazac. Rukovalac podacima je datoteka koja opisuje šta treba učiniti sa podacima obrasca. Rezultat ove obrade je nova HTML stranica, koja se vraća u pretraživač. Drugim riječima, u atributu akcija Određuje URL putanju do datoteke rukovaoca na serveru (ponekad se naziva stranica skripte) za obradu obrasca. Sintaksa je sljedeća:
Datoteka za obradu se nalazi na serveru mytestserver.com u folderu imenik i naziv serverske skripte koja će obraditi podatke - obrabotchik.php. Na njega će se prenijeti svi podaci koje ste unijeli u obrazac na web stranici. Ekstenzija .php označava da je navedeni obrazac obrađen PHP skriptom. Sam rukovatelj može biti napisan na drugom jeziku, na primjer, može biti skriptni jezik Python, Ruby, itd.
Preporučljivo je uvijek postaviti vrijednost atributa akcija. Ako obrazac mora dostaviti vrijednosti na istoj stranici na kojoj se nalazi, navedite prazan niz kao vrijednost atributa akcije: action="".
atribut metode
Atribut metoda specificira kako se informacije šalju serveru. Izbor načina podnošenja obrasca zavisi od podataka koje je potrebno poslati uz njega. Ovdje obim ovih podataka igra glavnu ulogu. Dvije najpopularnije metode prosljeđivanja neobrađenih podataka vašeg obrasca iz pretraživača na server su: GET i POŠTA. Metoda je postavljena na bilo koju po vašem izboru, a ako je niste naveli, koristit će se po defaultu GET. Razmotrimo primjenu svakog od njih.
POST metoda
Metoda POŠTA pakuje podatke obrasca i šalje ih serveru, a da korisnik to ne primijeti, budući da su podaci sadržani u tijelu poruke. Web pretraživač kada koristite metodu POŠTAšalje zahtjev serveru koji se sastoji od posebnih zaglavlja praćenih podacima obrasca. Pošto je sadržaj ovog zahtjeva dostupan samo serveru, POŠTA koristi se za prijenos povjerljivih podataka kao što su lozinke, podaci o bankovnoj kartici i drugi lični podaci korisnika. Metoda POŠTA pogodan i za slanje velikih količina informacija, jer, za razliku od metode GET, nema ograničenja u broju prenesenih znakova.
GET metoda
Kao što već znate, glavni posao pretraživača je primanje web stranica sa servera. Dakle, kada koristite metodu GET, vaš pretraživač jednostavno prima web stranicu kao i uvijek. Metoda GET također omota podatke obrasca, ali ih dodaje na kraj URL-a prije slanja zahtjeva serveru. Da biste razumjeli kako metoda funkcionira GET da vidimo na delu. Otvorite prvi primjer iz ovog vodiča (Primjer: Jednostavan HTML obrazac) u notepadu (kao što je Notepad++) i napravite malu promjenu u HTML kodu:
