Formuláře - Český HTML 5 manuál

HTML a CSS Manuál Formuláře Formuláře - Český HTML 5 manuál

Unicorn College ONEbit hosting Tento obsah je dostupný zdarma v rámci projektu IT lidem. Vydávání, hosting a aktualizace umožňují jeho sponzoři.

Formulář je část stránky, která se běžnému uživateli jeví podobně jako dialogové okno. Slouží k získávání informací od uživatele, které jsou následně odeslány na server ke zpracování. K tomu se používají serverové skripty, musíme tedy vytvořit stránku s formulářem a ještě skript, který zaslaná data správně zpracuje (nejčastěji se využívá jazyka PHP). Formulář může obsahovat různá vstupní pole, tlačítka a přepínače. Na základě odeslaných dat (např. políčka s emailovou adresou a textem zprávy) provede aplikace na serveru požadovanou operaci (např. odešle email na zadanou adresu a se zadaným textem).

S formuláři souvisí pojem webová aplikace. Tak se říká dynamickým "webovým stránkám", které se od obyčejných stránek značně oddalují a blíží se spíše aplikaci, jaké běžně známe z desktopů. Nejedná se tedy již o stránku jako dokument, ale stránku jako program, který od uživatele bere nějaký vstup a poté na něj reaguje, případně opět vrací nějaká data. Formulářů může být na jedné stránce více, ale nesmí být do sebe vnořeny.

<form>

Formulář se vkládá do stránky pomocí tagu <form>.

Kód jednoduchého formuláře pro zadání jména, příjmení a emailu by mohl vypadat např. takto:

<form method="post">
        Jméno: <input type="text" name="jmeno" /><br />
        Přijmení: <input type="text" name="prijmeni" /><br />
        E-mail: <input type="email" name="email" /><br />
        <input type="submit" />
</form>

Kód výše se v prohlížeči zobrazí následovně:

HTML formulář pomocí tagu form

Atributy

Elementu <form> můžeme přiřadit následující atributy:

  • accept-charset - Povolení pouze určitých znakových sad, které server akceptuje. Nejčastěji UTF-8.
  • action - Určuje URL adresu skriptu, který bude obsah zpracovávat. Pokud není uveden, data se odešlou na to samé URL, na kterém je formulář (viz příklad výše). Explicitně můžeme zadat adresu skriptu např. takto:
<form action="vyhodnoceni.php" method="post">
  • method - Určuje metodu odeslání dat. Máme k dispozici 2 metody: GET a POST. GET je výchozí hodnota (pokud tento atribut neuvedeme) a označuje metodu poslání dat z formuláře pomocí hodnot v URL adrese. Setkáváme se zde s limitem délky hodnot, adresa nevypadá hezky a není zabezpečená. POST označuje metodu odeslání dat, kdy jsou data zabalena v těle http požadavku. Data jsou šifrována, schována a nemají omezenou velikost. Metoda POST se pro používání formulářů preferuje.
  • autocomplete - Nabývá hodnot on a off, přičemž on je výchozí. Pokud je autocomplete zapnutý, nabízí prohlížeč uživateli při vyplňování údajů našeptávač, který zobrazuje dříve zapsané hodnoty.
  • name - Přiřazuje formuláři jméno. Používá se zejména, když je na stránce více formulářů nebo když s formulářem pracujeme např. pomocí JavaScriptu.
  • novalidate - Atribut je hodnoty typu boolean (ja zapnutý, pokud je uveden a na hodnotě nezáleží). Specifikuje, zda se má formulář před odesláním zvalidovat. Tento atribut můžeme dospecifikovat zvlášť u jednotlivých elementů formuláře.
  • target - Specifikuje cílové umístění odpovědi formuláře. _blank vyvolá odpověď v nové záložce, _top otevře odpověď v nejhlavnějším rámu, _parent v nadřazeném rámu a _self v aktuálním okně (to je výchozí hodnota). Jako hodnotu můžeme také uvést id rámu.
  • enctype - Určuje způsob kódování obsahu formuláře. Výchozí hodnota je application/x-www-form-urldecode, kde jsou mezery nahrazeny plusy a speciální znaky jsou zkonvertovány na hexadecimální hodnoty. Dále můžeme zadat multipart/form-data, která je vyžadována v případě, že má formulář pole k odeslání souboru. Tehdy se žádné znaky nenahrazují. Poslední hodnota je text/plain, kdy se nahrazují pouze mezery plusy.

Elementy formuláře

Formulář může obsahovat následující elementy:


 

 

Manuál pro vás napsal David Čápka
Avatar
Autor pracuje jako softwarový architekt a pedagog na projektu ITnetwork.cz (a jeho zahraničních verzích). Velmi si váží svobody podnikání v naší zemi a věří, že když se člověk neštítí práce, tak dokáže úplně cokoli.
Unicorn College Autor se informační technologie naučil na Unicorn College - prestižní soukromé vysoké škole IT a ekonomie.
Miniatura
Všechny články v sekci
Formuláře - Český HTML 5 manuál
Aktivity (1)

 

 

Komentáře

Avatar
Daniel Vítek
Tým ITnetwork
Avatar
Daniel Vítek:2.8.2012 20:12

máš tam chybu

  • <otpion>
 
Odpovědět 2.8.2012 20:12
Avatar
David Čápka
Tým ITnetwork
Avatar
Odpovídá na Daniel Vítek
David Čápka:3.8.2012 15:31

Díky, opraveno :)

Odpovědět 3.8.2012 15:31
Miluji svou práci a zdejší komunitu, baví mě se rozvíjet, děkuji každému členovi za to, že zde působí.
Avatar
Darkmagic
Redaktor
Avatar
Darkmagic:4.8.2012 20:37

Možná by bylo dobré uvést že k inputu se dá použít value pro změnu textu ;) (Já tě nechci poučivat ty si šéfix)

Odpovědět 4.8.2012 20:37
Nejhorší je, když myslíš, že víš
Avatar
David Čápka
Tým ITnetwork
Avatar
Odpovídá na Darkmagic
David Čápka:4.8.2012 21:47

Toto není článek o inputu, ale o formuláři obecně, u článků k inputům je to napsáno :)

Odpovědět 4.8.2012 21:47
Miluji svou práci a zdejší komunitu, baví mě se rozvíjet, děkuji každému členovi za to, že zde působí.
Avatar
Darkmagic
Redaktor
Avatar
Odpovídá na David Čápka
Darkmagic:5.8.2012 13:11

Ale samotný inputy jsou na nic, uděláš i článek jak je používat třeba pro ppřihlašování na server? To by mě docela zajímalo, teda typ přihlašování přes vypsané loginy a hesla

Odpovědět 5.8.2012 13:11
Nejhorší je, když myslíš, že víš
Avatar
Kit
Redaktor
Avatar
Odpovídá na Darkmagic
Kit:5.8.2012 13:23

Jenže přihlašování na server přes formulář už není záležitostí HTML, ale PHP a zpravidla i SQL. Tento seriál je o HTML, tak to do toho nemíchej.

Odpovědět 5.8.2012 13:23
Vlastnosti objektů by neměly být veřejné. A to ani prostřednictvím getterů/setterů.
Avatar
David Čápka
Tým ITnetwork
Avatar
Odpovídá na Darkmagic
David Čápka:5.8.2012 17:41

Díky Kite :) Zpracování formuláře řeší serverový jazyk, viz sekci PHP, již tam je nějaký pátek jak formuláře zpracovat.

Odpovědět 5.8.2012 17:41
Miluji svou práci a zdejší komunitu, baví mě se rozvíjet, děkuji každému členovi za to, že zde působí.
Děláme co je v našich silách, aby byly zdejší diskuze co nejkvalitnější. Proto do nich také mohou přispívat pouze registrovaní členové. Pro zapojení do diskuze se přihlas. Pokud ještě nemáš účet, zaregistruj se, je to zdarma.

Zobrazeno 7 zpráv z 7.