Tag input

Tag input vytváří různé prvky HTML formuláře: běžné vstupní pole, pole pro zadání hesla, zaškrtávací políčko checkbox, přepínače (radio), tlačítko.

Tag input by měl být umístěn uvnitř tagu form. To není povinné, ale je nutné pro odeslání dat na server a jejich následné zpracování pomocí PHP.

Nevyžaduje uzavírací tag.

Atributy

Atribut	Popis
type	Nastavuje typ vstupního pole. Možnosti viz níže.
value	Výchozí hodnota ve vstupním poli. V případě tlačítka nastavuje jeho text. Podrobněji viz atribut value.
placeholder	Nápověda ve vstupním poli, podrobněji viz atribut placeholder.
name	Název vstupního pole. Je potřeba pro získání dat vstupního pole v PHP. Pro korektní funkci formuláře by se názvy vstupních polí neměly shodovat (v rámci jednoho formuláře). Pokud se shodují - v PHP přijdou data toho vstupního pole, které je níže v HTML kódu.
disabled	Blokuje prvek formuláře (nejen input, ale prakticky jakýkoli), podrobněji viz atribut disabled.

Hodnoty atributu type

Hodnota	Popis
text	Vytváří běžné textové vstupní pole.
password	Vytváří textové vstupní pole pro heslo. Zkuste do něj napsat text - zobrazí se jako hvězdičky.
checkbox	Vytváří zaškrtávací políčko checkbox. Podrobněji viz checkbox.
radio	Vytváří přepínač radio. Podrobněji viz radio.
hidden	Vytváří skrytý input, který nebude viditelný na obrazovce, ale bude odesílat data obsažená v atributu value na server.
button	Vytváří tlačítko. Stisk tohoto tlačítka neodešle formulář na server. Může být použito uvnitř odkazu nebo pomocí JavaScript. Ve výchozím nastavení tlačítko nemá text (příklad tlačítka bez textu: ), ten se nastavuje pomocí value. Viz také tag button, který také vytváří tlačítko.
submit	Vytváří tlačítko, které odešle data na server. Text tlačítka závisí na prohlížeči, lze jej změnit pomocí value. Viz také tag button, který také vytváří tlačítko.
reset	Vytváří tlačítko, které vyčistí vyplněný formulář. Text tlačítka závisí na prohlížeči, lze jej změnit pomocí value.
file	Vytváří tlačítko pro výběr souboru. Design tohoto tlačítka nelze měnit pomocí CSS (existují však složité způsoby). Pokud potřebujete takové pole ve formuláři, pak tag form musí mít atribut enctype s hodnotou multipart/form-data.

Nové hodnoty atributu type v HTML5

Tyto hodnoty atributu jsou nové, objevily se až v HTML5, takže v některých prohlížečích nemusí fungovat nebo mohou fungovat různě v různých prohlížečích.

V případě, že prohlížeč nemůže rozpoznat obsah atributu type (například pokud není podporován nebo je chybně zadaný), bude prvek považovat za běžný textový input, jako by v type byla hodnota text.

Podívejte se na níže uvedené příklady v různých prohlížečích. Zkuste zadat do inputů text a stisknout tlačítko odeslání. Pokud je text nekorektní nebo pole prázdné - prohlížeč zobrazí chybu. Například, pokud do pole s typem email zadáte nekorektní email - prohlížeč neumožní odeslat formulář a zobrazí chybové hlášení (text chyby a její vzhled nelze měnit pomocí html css). Pokud je pole prázdné - prohlížeč také zobrazí chybu, to je dosaženo pomocí atributu required:

Hodnota	Popis
email
number
url
tel
search
color
date
month
week
datetime
datetime-local
range

Viz také