XHTML – element input

19. května 2003

•

Pomocí elementu input se vytváří základní ovládací prvky formulářů v XHTML. V tomto článku si tento element podrobně popíšeme.

Element input – základní ovládací prvky

Povolený obsah: EMPTY (žádný obsah)

Atributy:

%attrs;

Tato parametrická entita obsahuje další parametrické entity:
%coreattrs; (atributy id, class, style a title),
%i18n; (atributy lang, xml:lang a dir) a
%events; (atributy onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown a onkeyup).

%focus;

Tato parametrická entita obsahuje atributy specifické pro elementy, které mohou obdržet tzv. fokus – ten se uplatňuje obvykle při procházení stránky klávesnicí (typicky pomocí klávesy Tab). Řadíme sem atributy accesskey, tabindex, onfocus a onblur.

type %InputType; 'text'

Tento atribut specifikuje typ ovládacího prvku. Může nabývat deseti různých hodnot pro deset různých ovládacích prvků. Každý ovládací prvek je velmi specifický a s každým se také pojí jiné atributy. Existuje jenom několik atributů, které jsou pro všechny ovládací prvky společné – ty jsou uvedeny zde.

V dalším textu si budeme popisovat jednotlivé ovládací prvky, které se dají pomocí elementu input vytvořit a zároveň si také popíšeme atributy, které jsou pro každý z nich specifické.

Pro šťouraly: Teoreticky můžete samozřejmě u jakékoliv instance elementu input použít všechny atributy, které má tento element deklarované v DTD (a že jich je požehnaně). Prakticky to ale jenom u některých dává smysl (například nastavovat soubor s obrázkem u textového pole je nelogické) a právě těmito případy se budeme zabývat.

name CDATA #IMPLIED

Pomocí tohoto atributu nastavujete ovládacímu prvku jméno pro odesílání. Toto jméno musí být jedinečné v rámci celého formuláře (až na jednu výjimku), ve dvou různých formulářích na téže stránce se tedy mohou vyskytovat ovládací prvky se stejnými jmény.

Toto jméno slouží pouze pro účely odesílání formuláře, pro žádné jiné (odkazování ve skriptech, stylech a podobně). K tomu je určen atribut id, který je s name neslučitelný (má jiný význam a pravidla pro používání). Proto nemusíte atribut name uvádět, pokud prvek není součástí formuláře.

value CDATA #IMPLIED

Tento atribut specifikuje výchozí hodnotu ovládacího prvku. Ta se obvykle nějak projeví na vzhledu ovládacího prvku (například u textového pole bude výchozí hodnota zároveň přednastaveným textem), o čemž vás budu informovat u jednotlivých ovládacích prvků.

disabled (disabled) #IMPLIED

Tento atribut způsobí, že daný ovládací prvek je „vyřazen“, což se obvykle projevuje zašednutím políčka. Uživatel v takovém případě nemůže měnit jeho hodnotu, daný prvek je přeskakován při navigaci klávesnicí a jeho jméno a hodnota nejsou odesílány spolu s formulářem.

Obvykle se tohoto atributu využívá ve spojení s klientskými skripty, kdy například znemožníte uživateli odeslat formulář (nastavením tohoto atributu u odesílacího tlačítka) dříve, než zadá všechny povinné hodnoty.

onchange %Script; #IMPLIED

Tato událost je aktivována, pokud uživatel změnil hodnotu ovládacího prvku. Dojde k tomu ve chvíli, kdy prvek ztratí fokus (de-facto se jedná o událost onblur, přičemž navíc musí dojít ke změně hodnoty ovládacího prvku).

size CDATA #IMPLIED

Tento atribut udává šířku ovládacího prvku, přičemž jeho hodnotou je číslo. U různých prvků má ale tato hodnota různý význam, proto se ještě k tomuto atributu budeme vracet.

Tento atribut se vyskytuje hlavně kvůli zpětné kompatibilitě, pokud můžete, měli byste místo něj využívat styly.

Element input v XHTML 1.0 Strict DTD

Element input je základním prvkem XHTML pro vytváření ovládacích prvků. Jeho použití se velmi liší v závislosti na tom, jakou hodnotu má atribut type. Proto budeme probírat jednotlivé prvky zvlášť.

Textová pole – type=“text“ a type=“password“

Atributy:

readonly (readonly) #IMPLIED: Tento boolean-atribut říká, že textové pole je jenom pro čtení – hodnotu, která je zde uvedena, nemůže uživatel změnit. Narozdíl od atributu disabled však textové pole s tímto atributem obvykle nezašedává, jeho hodnota a jméno jsou odesílány, není přeskakováno při navigaci klávesnicí a uživatel na něj může přemístit fokus. Jediné, co nemůže, je změnit jeho hodnotu.
onselect %Script; #IMPLIED: Tato událost je aktivována ve chvíli, kdy uživatel vybere v poli nějaký text.
size CDATA #IMPLIED: Udává šířku pole ve znacích. Hodnota prvku však může být i delší než zde uvedený počet znaků, protože text se může v poli posouvat (pole může skrolovat).
maxlength %Number; #IMPLIED: Tento atribut nastavuje maximální délku textu ve znacích, která může být do pole zapsána. Tato hodnota může být větší než hodnota atributu size, v takovém případě se bude text v poli posouvat. Pokud atribut maxlength neuvedete, bude moci uživatel zapsat teoreticky neomezený počet znaků.
value CDATA #IMPLIED: Tento atribut zde uvádět nemusíte, pokud ho ale uvedete, bude zde uvedený text použit jako výchozí text v políčku.

Tento tvar elementu input vytvoří jednořádkové textové pole. Pokud je type="text", potom se do něj bude zapisovat text normálně.

Pokud je type="password", potom se zadaný text nebude zobrazovat na obrazovce (obvykle budou všechny jeho znaky nahrazeny hvězdičkami), tento typ textového pole slouží k zadávání hesel. Účelem je, aby nikdo, kdo je v blízkosti počítače, kde se zadává heslo, toto heslo nemohl přečíst.

Ochrana je to však pouze vizuální, skutečnou hodnotou pole je i v tomto případě uživatelem zadaný text (a ne např. hvězdičky). Navíc je po zadání heslo odesíláno stejným způsobem jako jakákoliv jiná hodnota, což například v případě běžného protokolu HTTP znamená nezašifrované.