LINUXSOFT.cz Přeskoč levou lištu
Uživatel: Heslo:  
   CZUKPL

> HTML (11) - formuláře

Formuláře se budou určitě hodit všem, kteří sledují i seriál o PHP. Dnes si řekneme něco málo z teorie a vytvoříme jednoduchý formulář.

19.8.2004 15:00 | Pavel Kácha | Články autora | přečteno 44210×

Co to je webový formulář

Webový formulář je část stránky složená z různých tlačítek, vstupních polí a přepínačů, která slouží pro získání nějakých dat od uživatele. Na základě těchto dat se potom provádí script (napsaný v PHP, Javě nebo v jakémkoli jiném jazyku) a jeho výsledek se nějak předá uživateli. Obvykle script formátuje text pomocí HTML značek a svůj výsledek předá prohlížeči, který ho zobrazí.

Z předchozího odstavce vyplývá, že formulář může být zajímavým zpestřením našich stránek, ale pokud chcete mít z formuláře nějaký výsledek, neobejdete se bez scriptů, které data z formuláře zpracují. Samotný formulář může plnit jedině funkci "datové Černé díry", tzn. že všechna data, která do formuláře vyplníte, se nenávratně ztratí. Po něčem takovém asi netoužíte, takže předpokládejme, že máte připraven script pro zpracování zadaných údajů.

Začínáme tvořit formulář

Formulář je na stránce označen pomocí párového tagu <form></form>. Ukončovací tag je povinný. Tímto způsobem určíme, které formulářové prvky (vstupní pole, tlačítka atd.) patří k sobě a budou se odesílat najednou - jednomu řídícímu scriptu. Jednotlivých formulářů může být na stránce libovolně mnoho, ale nesmí se navzájem nijak prolínat.

I element <form> má několik atributů, které ovlivňují jeho chování. Nejdůležitějšími atributy, které budete potřebovat vždy při použití formulářů, jsou action="" a method=""

Atributem action="" určíte, který script se má použít pro zpracování zadaných údajů. Pokud nemáte možnost použít žádný jazyk pro zpracování dat, můžete je odeslat na mail, stačí jen napsat jako hodnotu atributu action="" řětězec v takovémto tvaru:

mailto:muj_mail@server.cz

Veškeré údaje potom přijdou pohodlně až do vaší schránky.

Hodnota atributu method="" určuje metodu jakou mají být data odeslána ke zpracování. Na výběr máte ze dvou možností.

  1. get
  2. post

get

Tato metoda se používá spíše pro odesílání menších formulářů. Uplatnění najde i u takových formulářů, kde příliš nezáleží na bezpečnosti (jednoduché stránkování), protože pokud odesíláme data metodou get, je velice jednoduché je zfalšovat a podstrčit scriptu nějaké nekorektní údaje. Proto pokud používáte metodu get, měli byste být velice opatrní a správnost zadaných dat klidně i několika způsoby kontrolovat. To platí i u motody post, ale tam je podstrčení špatných dat o malinko složitější.

Před přenosem se data musí "zakódovat" pro správný přenos. Při zakódování se nahradí mezery za znak +. Další speciální znaky (/, :, @, ;, ?, #, &, =, %, +, {, }, |, \, ^, ~, [, ]) a např. znaky s diakritikou se převedou do tvaru %xx, kde xx je hexadecimální kód znaku. O zakódování se postará automaticky prohlížeč.

Data jsou pak přidána k adrese stránky za otazník (?), jednotlivé položky jsou odděleny pomocí znaku and (&). A tady je právě největší problém: uživatel může velice jednoduše přepssat zadaná data a způsobit pád nebo špatnou funkci naší aplikace. Ukázková URL doplněná o data zaslaná metodou get může mít takovouto podobu:

http://www.server.cz/index.php?odkud=50&kam=100

Tímto způsobem předáme scriptu index.php vstupni promenné odkud (s hodnotou 50) a kam (s hodnotou 100).

post

Tato metoda kóduje zadaná data stejně jako get (pokud způsob kódování nezměníte atributem enctype="" - viz níže), ale posílá je zvlášť - mimo URL. Veškerá data se rovnou směrují na standardní vstup scriptu. Tato data se sice nikde nezobrazí, ale to neznamená, že je nejde změnit: pokud si připravíte vlastní formulář, který vrací stejně pojmenované proměnné a necháte ho zpracovat původním scriptem, může se vám podařit obelstít ochranu a způsobit pád nebo špatnou funkci aplikace.

Další atributy

Velice užitečná je možnost určit, jak se bude obsah adresáře kódovat. Slouží k tomu atribut enctype="". Výchozí hodnotou je application/x-www-form-urlencoded. Pro běžné formuláře, které načítajíjen textová data toto kódování naprosto stačí, ale pokud chcete přenášet i celé soubory (obrázky, dokumenty, tabulky...) musíte použít kódování multipart/form-data. Jak posílat přes formulář soubory si řekneme někdy příště.

enctype="" má smysl použít jen pokud posíláte data metodou post, protože metoda get umí jen výchozí způsob kódování (application/x-www-form-urlencoded)

Existuje také atribut accept-charset="", který určuje které znakové sady dokáže server zpracovat. Jako hodnota atributu se uvádí seznam znakových sad oddělených pomocí mezer nebo čárek a mezer. Výchozí hodnotou je unknown, prohlížeč potom bude posílat data ve stejném kódování jako má stránka, na které je formulář uveden.

Atributem accept="" definujete, které typy souborů formulář akceptuje. Hodnotou tohoto atributu je čárkami oddělený seznam povolených MIME-typů. Tento atirbut má cenu používat jen pokud ve formuláři načítáte soubory.

name="" nám dovoluje pojmenovat formulář, aby na něj bylo možné odkazovat v např. CSS a scriptech. Tento atribut je zachován pouze kvůli zpětné kompatibilitě, v současné době by se měl používat spíše atribut id="", který má tytéž vlastnosti.

Můžete použít i atribut target="", kterým definujete kam se má zobrazit výsledek po zpracování formuláře. O tomto atributu jsme už mluvili, takže pokud nevíte, jakou hodnotu máte nastavit, podívejte se do dílu o odkazech.

Další zajímavé atriburty jsou atributy onsubmit="" a onreset="". Script nebo funkce uložená jako jejich hodnota se provede po kliknutí na odesílací tlačítko resp. po kliknutí na vymazávací tlačítko.

Kromě těchto atributů můžete uvést i atributy, které jsou definovné pro všechny elementy HTML (id, class, lang, dir, title, style, onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup).

Teorie už bylo dost

Teď si uděláme jednoduchý formulář. Trochu předběhnu, abych neunavoval dalšími definiceni, ale v příštím díle se na všechno zaměřím pěkně dopodrobna. Dnes zmíním jen základy nutné pro pochopení příkladu. Příklad bude formulář, který nám vyhledá obec podle zadaného PSČ. Využijeme k tomu PHP script ze seriálu Petra Zajíce.

Budeme potřebovat jedno políčko, do kterého zadáme hledané PSČ a tlačítko pro odeslání. Políčko vytvoříme napsáním

<input type="text" name="jmeno_predavane_promenne">

A pro vytvoření odesílacího tlačítka musíme napsat:

<input type="submit" value="text na tlacitku">

Ještě dodám, že script je umístěn script na adrese http://www.linuxsoft.cz/php/examples/38_psc.php (tam budeme formulář odesílat) a očekává data předaná metodou POST.

Zde je zdrojový kód našeho prvního formuláře.

<form method="post" action="http://www.linuxsoft.cz/php/examples/38_psc.php"> Zadejte PSČ:
<input type="text" name="psc"> <input type="submit" value="Zjisti obec"> </form>

A formulář vám samozřejmě nabídnu i ve funkční podobě:

Zadejte PSČ:

Nashledanou přístě

Verze pro tisk

pridej.cz

 

DISKUZE

Parazitní formuláře 22.8.2004 22:36 Petr Zajíc




Příspívat do diskuze mohou pouze registrovaní uživatelé.
> Vyhledávání software
> Vyhledávání článků

4.10.2018 21:30 /Ondřej Čečák
LinuxDays 2018 již tento víkend, registrace je otevřená.
Přidat komentář

18.9.2018 23:30 /František Kučera
Zářijový pražský sraz spolku OpenAlt se koná již tento čtvrtek – 20. 9. 2018 od 18:00 v Radegastovně Perón (Stroupežnického 20, Praha 5). Tentokrát bez oficiální přednášky, ale zato s dobrým jídlem a pivem – volná diskuse na téma IoT, CNC, svobodný software, hardware a další hračky.
Přidat komentář

9.9.2018 14:15 /Redakce Linuxsoft.cz
20.9.2018 proběhne v pražském Kongresovém centru Vavruška konference Mobilní řešení pro business. Návštěvníci si vyslechnou mimo jiné přednášky na témata: Nejdůležitější aktuální trendy v oblasti mobilních technologií, správa a zabezpečení mobilních zařízení ve firmách, jak mobilně přistupovat k informačnímu systému firmy, kdy se vyplatí používat odolná mobilní zařízení nebo jak zabezpečit mobilní komunikaci.
Přidat komentář

12.8.2018 16:58 /František Kučera
Srpnový pražský sraz spolku OpenAlt se koná ve čtvrtek – 16. 8. 2018 od 19:00 v Kavárně Ideál (Sázavská 30, Praha), kde máme rezervovaný salonek. Tentokrát jsou tématem srazu databáze prezentaci svého projektu si pro nás připravil Standa Dzik. Dále bude prostor, abychom probrali nápady na využití IoT a sítě The Things Network, případně další témata.
Přidat komentář

16.7.2018 1:05 /František Kučera
Červencový pražský sraz spolku OpenAlt se koná již tento čtvrtek – 19. 7. 2018 od 18:00 v Kavárně Ideál (Sázavská 30, Praha), kde máme rezervovaný salonek. Tentokrát bude přednáška na téma: automatizační nástroj Ansible, kterou si připravil Martin Vicián.
Přidat komentář

18.6.2018 0:43 /František Kučera
Červnový pražský sraz spolku OpenAlt se koná již tento čtvrtek – 21. 6. 2018 od 18:00 v Kavárně Ideál (Sázavská 30, Praha), kde máme rezervovaný salonek. Tentokrát na téma: F-Droid, aneb svobodný software do vašeho mobilu. Kromě toho budou k vidění i vývojové desky HiFive1 se svobodným/otevřeným čipem RISC-V.
Přidat komentář

23.5.2018 20:55 /Ondřej Čečák
Od pátku 25.5. proběhne na Fakultě informačních technologií ČVUT v Praze openSUSE Conference. Můžete se těšit na spostu zajímavých přednášek, workshopů a také na Release Party nového openSUSE leap 15.0. V na stejném místě proběhne v sobotu 26.5. i seminář o bezpečnosti CryptoFest.
Přidat komentář

20.5.2018 17:45 /Redakce Linuxsoft.cz
Ve čtvrtek 31. května 2018 připravuje webový magazín BusinessIT ve spolupráci s Best Online Média s.r.o. pátý ročník odborné konference Firemní informační systémy 2018. Akce proběhne v kongresovém centru Vavruška (palác Charitas), Karlovo náměstí 5, Praha 2 (u metra Karlovo náměstí) od 9:00 hod. dopoledne do cca 15 hod. odpoledne. Konference je zaměřena na efektivní využití firemních informačních systémů a na to, jak plně využít jejich potenciál. Podrobnější informace na webových stránkách konfrence.
Přidat komentář

   Více ...   Přidat zprávičku

> Poslední diskuze

5.10.2018 17:12 / Jakub Kuljovsky
Re: Jaký kurz a software by jste doporučili pro začínajcího kodéra?

20.9.2018 10:04 / Jan Ober
Jaký kurz a software by jste doporučili pro začínajcího kodéra?

20.9.2018 10:00 / Jan Ober
Re: Gimp

20.2.2018 18:48 / Ivan Majer
portal

20.2.2018 15:57 / Jan Havel
Jak využíváte služby cloudu v podnikání?

Více ...

ISSN 1801-3805 | Provozovatel: Pavel Kysilka, IČ: 72868490 (2003-2018) | mail at linuxsoft dot cz | Design: www.megadesign.cz | Textová verze