PHP a formuláře I

Obsah lekce:

Formulář

Většina lidí se dnes setkalo s formulářem na webu. Nejčastěji to bývá například při zakládání freemailové poštovní schránky na některém ze serverů, které tuto službu poskytují. Do formuláře uživatel vyplní požadované údaje a pokusí se formulář odeslat (většinou kliknutím na stejnojmenné tlačítko). Po kliknutí na toto tlačítko se zadané informace odešlou na server a tam se zpravidla provede jejich kontrola (zda je vyplněno vše potřebné, zda je to vyplněno alespoň trochu smysluplně - v rámci možností počítačového zpracování) a buď se formulář zobrazí znovu s patřičnými instrukcemi a soupisem chybně zadaných údajů nebo dojde ke zpracování zadaných dat a například jejich uložení do databáze na server.

Tvorba webových formulářů sestává ze dvou kroků:

• Návrh struktury formuláře a vytvoření jeho HTML kódu.
• Implementace funkčnosti formuláře (kontrola, vyhodnocení a zpracování zadaných dat).

Vložení formuláře do HTML stránky

Formulář se do stránky vkládá mezi značky <form> a </form>. Jako atributy tagu form se udávají následující dva:

• action - akce, která se má po odeslání formuláře provést. Jedná se o URL (jméno skriptu) skriptu, kterému se mají zadané informace z formuláře poslat.
• method - metoda, kterou se budou přenášet informace z formuláře na server. Možné varianty jsou get nebo post.

Stručně k metodám POST a GET

Atribut method značky form určuje způsob, kterým se budou z formuláře odesílat data. Kterou metodu zvolíme záleží na nás, ale musíme uvažovat následující:

• get (http://cs.wikipedia.org/wiki/GET) - všechna data z formuláře se posílají přes URL (adresu viditelnou v prohlížeči) stránky a vloží se do řádku s adresou za jméno stránky oddělené otazníkem. Tuto metodu je možno použít kdekoliv, ale většinou se používá u jednodušších formulářů, kde nedochází k posílání většího množství dat. Get se nedoporučuje používat kdekoli to opravdu není nutné, protože kdokoliv VEŠKERÁ posílaná data vidí a může je tedy LIBOVOLNĚ MĚNIT. Toto představuje bezpečnostní riziko. Navíc délka URL je omezená (viz například citace z webu Microsoftu): Aplikace Microsoft Internet Explorer má maximální délku adresy URL (Uniform Resource Locator) 2 083 znaků. Rovněž maximální délka cesty je v této aplikaci omezena na 2 048 znaků. Toto omezení platí pro adresy URL požadavků POST i požadavků GET. V případě použití metody GET jste omezeni maximální hodnotou 2 048 znaků mínus počet znaků skutečné cesty. Metoda POST však není omezena velikostí adresy URL pro odesílání dvojic názvů a hodnot. Tyto dvojice jsou přenášeny v hlavičce, nikoliv v adrese URL. Mohlo by se zdát, že je takovýto počet znaků dostatečný, ale například v případě formulářů s dlouhými textovými řetězci (představte si dotazník s 30 otázkami, kde na každou otázku může uživatel napsat odpověď v délce až 256 znaků) nebo u komplexních webových aplikací (které pracují s velkým množstvím parametrů) může být tento počet již omezující a narušující vůbec možnost danou aplikaci provozovat. Zbývá zodpovědět otázku, co se stane, když délku url překročíte. Dojde k tomu, že se vezme maximální možná délka URL a zbytek nad povolenou délku se jednoduše zahodí (řetězec se zprava ořeže).
• post (http://cs.wikipedia.org/wiki/POST) - data neposílá v URL, ale jako samstatný HTTP objekt. Její jedinou nevýhodou je fakt, že při obnovení stránky (refresh) zobrazí tabulku s dotazem, zda si POST data přejeme opravdu znovu odeslat, což může být pro uživatele matoucí (často se proto metoda post nepoužívá v rámci firemních intranetových stránek, aby nebyli uživatelé frustrování a netelefonovali zbytečně na příslušná oddělení s dotazem, zda zobrazený dialog mohou potvrdit).

Nejpoužívanější formulářové prvky

V první fázi se tedy podívejme na nejpoužívanější formulářové prvky.

Textové pole - text

Textové pole pro delší text - textarea

Zaškrtávací pole - checkbox

Výběrové pole - radio

Seznam s výběrem možností - select

Tlačítko pro odeslání formuláře - submit

Nakonec ještě zmíníme tlačítko pro odeslání formuláře. Toto tlačítko musí být ve formuláři přítomno, aby se vůbec data z formuláře někam odeslala (po stisku tohoto tlačítka v této stránce se odešle formulář obsahující pouze toto tlačítko standardní metodou get současně zobrazené stránce).

Existují ještě další možné formulářové elementy, ale o nic si postupně povíme později.

Registrační formulář

Sestavte jednoduchý HTML formulář, který bude sloužit pro registraci uživatele řekněme na nějaký diskusní server. Formulář bude obsahovat následující údaje:

• Jméno
• Příjmení
• E-mail
• Pohlaví
• Kometář
• Témata, která uživatele zajímají

Zvolte vhodné formulářové prvky pro každý z údajů a vyzkoušejte metodu get i post a jejich chování při obnovení stránky po odeslání formuláře (standardně klávesa F5 v prohlížeči). Formulář by mohl vypadat například takto:

Je tento formulář v pořádku?

Domácí úkol

1. Popište alespoň dvě možnosti zápisu formulářů v HTML (nápověda: tabulky, značka label, značky dl, dt a dd). Ilustrujte jejich použití na předchozím registračním formuláři a diskutujte o vhodnosti jednotlivých řešení.

2. Pokuste se na Internetu najít aktuální online zdroje věnující se stylování formulářu pomocí CSS na různých platformách. Shrňte stručně výsledné informace a uveďte nalezené zdroje. Navrhněte styl pro předchozí registrační formulář.

Další čtení

Otázky

1. Jaká značka (tag) se používá pro vložení formuláře do stránky? Jaké má tato značka parametry a jaký je jejich význam?
2. Jaké jsou rozdíly mezi metodami get a post?
3. Vyjmenujte nejpoužívanější formulářové prvky a uveďte příklady jejich použití.