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

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ě:

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:

• <input>
• <textarea>
• <button>
• <select>
• <option>
• <optgroup>
• <fieldset>
• <datalist>
• <output>
• <label>