HTML a tvorba WWW strßnek - 8. lekce 29.Φervna 1998 xskrivan@fi.muni.cz

8.1 Forumlß°

Jazyk HTML obsahuje tagy, pomocφ nich₧ lze vytvß°et formulß°e. Ty slou₧φ pro zφskßvßnφ informacφ od klienta, kterΘ jsou poslßny serveru, na n∞m₧ se spustφ n∞jak² obslu₧n² program (CGI skript). Formulß° je jednou ze zßkladnφch HTML struktur a je tvo°en z nßsledujφcφch komponent:

• vstupnφ polφΦko, °ßdek pro psanφ textu - text
• zaÜkrtßvacφ polφΦko - checkbox
• p°epφnaΦ - radiobox
• rozvinovacφ seznam - combobox
• textovΘ okno, pro editaci delÜφho textu - textarea
• tlaΦφtka - button, submit, reset

Formulß° se vymezuje pßrov²m tagem <form>. JednotlivΘ komponenty lze pak °adit t°eba tabulky nebo seznamu - zkrßtka do jakΘkoli HTML struktury, snad krom∞ dalÜφho formulß°e. HTML struktura formulß°e je:

<form [atributy=hodnoty...]>     prvky formulß°e (libovoln∞ nßsklßdanΘ) </form>

Jak u₧ jsem °ekl, data z formulß°e jsou odeslßna a nßsledn∞ zpracovßna n∞jak²m skriptem. Data jsou skriptu p°edßna bu∩ formou parametr∙ (metoda GET), nebo vnit°n∞ (metoda POST).

<form method="metoda" action="URL skriptu">

• action jmΘno souboru, v n∞m₧ je napsan² skript pro zpracovßnφ dat z formulß°e. Pokud zatφm neumφte skript naprogramovat. m∙₧ete napsat mailto a vßÜ e-mail, nap°.: action="mailto:xskrivan@fi.muni.cz" a data vypln∞nß klientem ve formulß°i vßm dojdou e-mailem. (jako metodu musφte pou₧φt POST)
• method definuje zp∙sob odeslßnφ dat:
  • GET - doplnφ na konec URL skriptu, takto odeslanß data lze Φφst pak z prom∞nnΘ QUERY_STRING
  • POST - v t∞le po₧adavku, data z formulß°e lze Φφst ze stand. vstupu

(O programovßnφ skript∙ pro zpracovßnφ dat z formulß°e je v∞novanß strßnka CGI skripty, kterß je pr∙b∞₧n∞ dopl≥ovßna.

8.2 Vstupnφ pole

<input type="typ" name="jmΘno_pole" value="hodnota" [checked, size="velikost" ...]>

type
text	jedno°ßdkovΘ textovΘ pole pro vstup textu, atributem value lze zadat poΦßteΦnφ hodnotu polφΦka, kterou klient m∙₧e zm∞nit
password	totΘ₧, co text, ale s tφm rozdφlem, ₧e nenφ zobrazovßna u₧ivatelem zadßvßna hodnota (vypisujφ se hv∞zdiΦky "*")
checkbox	zaÜkrtßvacφ polφΦko, atributem value lze specifikovat hodnoty vrßcenou p°i zaÜkrtnutφ tohoto polφΦka
radio	volba prßv∞ jednΘ mo₧nosti (atribut name bude nap°. pro 4 p°epφnaΦe radio stejn², ale type bude nastaven na 1 2 3 a 4. (to jak u₧ivatel zaÜkrtne, takovΘ Φφslo bude vrßceno pro danΘ name)
submit	tlaΦφtko pro odeslßnφ dat z formulß°e serveru, atributem value lze specifikovat hodnotu (to je dobrΘ ud∞lat v p°φpad∞, ₧e formulß° mß vφce odesφlacφch tlaΦφtek, a atributem value defacto °φkßte, jak²m tlaΦφtkem byla data z formulß°e odeslßna
reset	tlaΦφtko na vyΦiÜt∞nφ osbahu formulß°e a nastavenφ implicitnφch hodnot
name	jmΘno vstupnφho pole odeslanΘ serveru, ve skriptu se paj zjiÜ¥uje, jakß je hodnota pole name
size	velikost vstupnφho pole, mß v²znam pouze u text|password
checked	uvedenφ tohoto atributu u typu checkbox|radio nastavuje implicitnφ zaÜkrtnutφ tlaΦφtka

8.3 P°φklady

P°φklad	Zdrojov² text HTML
JmΘno:	<input type="text" name="jmeno_uzivatele" size=25>
Heslo:	<input type="password" name="heslo" size=10>
1. mo₧nost 2. mo₧nost 3. mo₧nost	<input name="volba" type="checkbox" value=1> 1. mo₧nost <input name="volba" type="checkbox" value=2 checked> 2. mo₧nost <input name="volba" type="checkbox" value=1> 3. mo₧nost
Pond∞lφ ┌ter² St°eda	<input name="den" type="radio" value=Po> Pond∞lφ <input name="den" type="radio" value=Ut> ┌ter² <input name="den" type="radio" value=St checked> St°eda
	<input name="no" type="reset" value="Vymazat">
	<input name="ok" type="submit" value="Potvrdit">

Programovßnφ CGI skript∙ nenφ nßplnφ tΘto strßnky, slidy v∞novanΘ k tΘto problematice naleznete na www.fi.muni.cz/~xskrivan/skola/cgi.html

---

[Zp∞t]	[Zm∞na k≤dovßnφ]