Formuláře

Tag	Význam	Párový	Výskyt
form	formulář	ano
input	vstupní pole	ne	<form>
select	výběrové pole	ano	<form>
option	volba	ne	<select>
textarea	velké vstupní pole	ano	<form>
label	popis pole	ano	<form>
fieldset	skupina polí	ano	<form>
optgroup	skupina voleb	ano	<select>
legend	popis pole	ano	<fieldset>
button	tlačítko	ano	<form>

form

Formulář. Párový tag. Uzavírá skupinu ovládacích polí do jednoho formuláře, který bude najednou odeslán.

Atributy tagu <form>
Atribut	Význam	Hodnoty
action	skript, který bude zpracovávat data	URL
method	způsob předávání dat	get \| post
enctype	způsob zakódování dat	application/x-www-form-urlencoded \| multipart/form-data \| libovolná mime deklarace

Action obvykle míří na nějaký CGI skript nebo PHP nebo ASP. Není-li uvedeno, odešlou se data téže stránce.

Výchozí metoda atributu method je get. Říká, že se data budou předávat jako součást URL, tedy v řádku adresy. Method=post zabalí odesílaná data a odesílá je nezávisle, takže nejsou vidět. Post je dobré nastavit u delších formulářů.

Atributem enctype se nemusíte zabývat, pokud vám nepůjde o posílání souborů nebo o přesný výstup českých znaků (pak nastavte multipart/form-data). Pro posílání jednoduché pošty doporučuji enctype="text/plain".

Následuje popis vstupních polí formuláře. Dělají se pomocí tagů <input>, <select> a <textarea>. Tyto musejí být umístěny v elementu <form>, ale navíc mohou být třeba i v tabulce. Popisky vstupních polí se dělají normálním textem kolem nich.

input

Vstupní pole. Nepárový tag.

Obecné atributy tagu <input>
Atribut	Význam	Hodnoty
type	druh vstupního pole	text \| password \| hidden \| radio \| checkbox \| submit \| reset \| image \| file \| button
name	jméno pole, které se odesílá s daty	libovolné jméno
value	hodnota pole (původní hodnota pole nebo text zobrazovaný na tlačítku)	libovolná hodnota
disabled	políčko bude šedé a nepůjde měnit (jen v některých prohlížečích)	bez hodnoty
readonly	obsah pole nepůjde měnit (fachá jen v některých prohlížečích)	bez hodnoty
align	zarovnání (jako u obrázku)	right, left + těch dalších x možností
Další atributy jsou přípustné na základě hodnoty atributu type.

Input v sobě zahrnuje celou škálu různých kolonek, tlačítek a přepínačů -- to všechno závisí na atributu type.

Tag <input>, atribut type. Různá vstupní pole.
type=	Druh vstupního pole	Další atributy
text	obyčejné textové pole	size= šířka ve znacích maxlength = nejvyšší možný počet zadaných znaků
password	textové pole s hvězdičkami	size= šířka ve znacích maxlenght - maximum znaků
hidden	skryté pole s předem nastavenou hodnotou
radio	přepínač puntíků (několik tagů <input type=radio> stejného jména (name) s různými hodnotami tvoří skupinu možností)	checked -- atribut bez hodnoty způsobí stisknutí puntíku
checkbox	zatrhávací tlačítko	checked -- atribut bez hodnoty způsobí zatržení
submit	potvrzující tlačítko způsobující odeslání formuláře
reset	tlačítko na smazání všech polí (na přednastavenou hodnotu)
image	potvrzující tlačítko odesílající navíc souřadnice kliknutí (name-x a name-y)	src= URL obrázku dynsrc, lowsrc jako u <img>
file	umožní zadat soubor	accept = MIME typ akceptovatelných souborů
button	tlačítko ovládané skriptovými atributy

V některých popisech HTML se vyskytují ještě typy range, scribble a jot, které ale podle mých zkušeností nefungují.

select

Výběr. Zobrazí obdélníček s možnostmi nebo roletkové menu. Párový tag, jeho obsahem jsou jednotlivé volby -- tagy <option>.

Atributy tagu <select>
Atribut	Význam	Hodnoty
name	jméno pole odesílatné s daty	libovolné jméno
multiple	umožnění hromadného výběru (s Ctrl)	bez hodnoty
size	počet zobrazených řádků	číslo
disabled	políčko bude šedé a nepůjde měnit (jen v některých prohlížečích)	bez hodnoty

Pokud je size 1, bude to roletkové menu. Při size 2 a vyšší se <select> zobrazí jako obdélníček s rolovací lištou. Bude-li hodnot stejně nebo méně než size, nebudou tam ani rolovací lišty.

option

Položka výběru. Nepárový tag (třebaže se může zadávat párově), obsahem elementu je text za tagem až do dalšího tagu.

Atributy tagu <option>
Atribut	Význam	Hodnoty
value	řetězec odesílaný jako hodnota pole	řetězec
selected	Položka je předem vybrána	bez hodnoty

Text za tagem <option> se zobrazí ve výběru.

textarea

Rozsáhlé vstupní pole (textarea = angl. prostor pro text). Zobrazuje rámeček s lištou.. Párový tag. Nemá atribut value, za implicitní hodnotu se považuje obsah elementu (to mezi párovými značkami).

Atributy tagu <textarea>
Atribut	Význam	Hodnoty
name	jméno odesílané s daty	jméno
cols	šířka pole ve znacích	číslo
rows	výška pole v řádcích	číslo
disabled	políčko bude šedé a nepůjde měnit (jen v některých prohlížečích)	bez hodnoty
readonly	obsah pole nepůjde měnit (fachá to jen v některých prohlížečích)	bez hodnoty

Následující tagy do HTML přibyly až ve verzi 4.0, takže jejich implementace není leckde ještě úplná.

label

Štítek, popisek pole. Vyskytuje se nejlépe před políčkem, ke kterému se vztahuje, aby to i v prohlížečích, které to nepodporují, dávalo smysl. Výhodou je aktivace pole formuláře, pokud se klikne na štítek, a lepší automatizace (accesskey, css). Vlastní text štítku se zadává jako obsah elementu -- jde o tag párový.

Atribut tagu <label>
Atribut	Význam	Hodnoty
for	svázání s polem stejného identifikátoru	hodnota atributu id u svázaného pole

Příklad: <label for="drak">Zadej jméno draka:</label> <input type="text" id="drak">

fieldset

Skupina polí. Párový tag, který opticky sdruží několik prvků formuláře a vykreslí kolem nich slabý rámeček. Čáru rámečku může přerušit text tagu <legend>. <fieldset> nemá žádné atributy kromě obecných. Vzhled se dá upravovat pomocí CSS. Starší prohlížeče tento tag ignorují.

optgroup

Skupina voleb ve výběrovém prvku <select>. Párový tag, kterým se obklopí skupinky tagů <option>. V šestkových verzích prohlížečů se potom takové skupinky zobrazí odsazené a budou mít nadpis tučnou kurzívou. Ten nadpis se zadává jako atribut label tagu <optgroup>. Pětkové a nižší verze prohlížečů tento tag ignorují a zobrazují volby normálně pod sebou.

Příklad: <select>
<optgroup label="nadpis skupinky">
<option>první</option>
<option>druhá</option>
</optgroup>
</select>

legend

Popisek skupiny polí (tagu <fieldset>). Zobrazuje se nad skupinou polí přes tu čáru. Musí být zapsána hned za značkou <fieldset>. Starší prohlížeče to nepodporují.

Atribut tagu <legend>
Atribut	Význam	Hodnoty
align	zarovnání popisku	libovolné html

Příklad: <fieldset>
<legend>Milá zvířátka</legend>
Kočičky: <input mane="kocky"><br>
Dráčci: <input name="draci">
</fieldset>

button

Tlačítko. Jedinou a hlavní výhodou je, že se do něj dá vložit libovolný HTML kód, který se na tlačítku zobrazí. Takže se mezi <button> a </button> dají vkládat obrázky, nadpisy, prostě cokoliv. Důležitý atribut je pouze type, podobný atributu type u tagu <input>.