MENU

<input>

Značka pro vložení celé řady prvků do formuláře, které např. umožní komunikaci návštěvníka se správcem webu. 

Ukázka jednoduchého formuláře

  <form method="get">
<input type="text" name="jmeno">
<input type="submit" value="Odeslat">
</form>  

Atributy značky <input>

type

Atribut type určuje druh inputu, což je nesmírně důležité, jelikož jich je opravdu hodně. Rozebereme si jednotlivé typy inputů:

type="text"

Patří mezi nejčastější a nejběžněji užívaný typ. Zobrazuje se jako řádek, do kterého je možné vkládat libovolný text i číslovky.

type="password"

Jak už název napovídá, slouží k heslům. Rozdíl oproti type="text" je v tom, že znaky do něj vložené se zobrazují jako tečky. 

type="email"

Je ve své podstatě totéž, co type="text". Rozdíl poznáte až v okamžiku, kdy přidáte atribut required, díky kterému internetový prohlížeč zkontroluje, zda obsah pole připomíná e-mailovou adresu. Pozor na to, že kontrola není stoprocentní. Prohlížeče v drtivé většině případů jen zkontrolují, zda se v poli nachází znak zavináče @ obklopený jinými znaky. Pozor, nefunguje na Safari.

type="number"

Pole, které návštěvníkovi dovolí vložit jen čísla celá (bez desetinných míst). Standardně mu dovolí, jak čísla kladná, tak i záporná. Rozsah povolených čísel je možné omezit. atributy např. min="0" a např. max="100". Pokud potřebujete, můžete i nastavit krokování. Pokud např. může být číslo jen násobek desítky můžete nastavit step="10".

type="checkbox" 

Zobrazí zaškrtávací políčka na volbu (graficky většinou čtvercová). U checkbox můžete volit libovolný počet možností, pokud jich je použito více. Každý <input type="checkbox"> musí mít atribut name s originálním názvem.   

 

type="radio"

Zobrazí zaškrtávací políčka na volbu (graficky většinou kruhová). Na rozdíl od checkbox však návštěvník stránek může zvolit jen jednu z možností. Ty <input type="radio">, u kterých chcete mít možnost zvolit jen jednu variantu musíte atributu name dát stejný název.  


type="date"

Se používá pro vložení datumu. Datum může být zapsán v celé řadě formátů, avšak tento typ inputu dokáže datum zapsat takovým způsobem, aby jej systémy dokázali vždy správně identifikovat a zpracovat. 

type="time"

Tak, jako date ukládá datum, tak type="time" zase uloží čas ve správném strojově zpracovatelném formátu.

type="datetime-local"

Jedno pole pro datum i čas současně. Má jednu nevýhodu. Nefunguje na prohlížeči Firefox, který je poměrně hodně rozšířen (v době psaní článku je druhý nejrozšířenější).

type="range"

Umožňuje nastavit rozsah mezi dvěma předdefinovanými hodnotami. 

type="search"

Slouží např. pro vyhledávání prostřednictvím Google. Jinak vypadá naprosto stejně, jako type="text".

type="file"

Je určen pro vkládání souborů. U souborů je vhodné určovat, jaké typy souborů jsou povolené. Povolené soubory se mohou určit pomocí atributu accept.

type="submit"

Slouží jako tlačítko k odeslání formuláře kliknutím myši za účelem zpracování obsahu formuláře.

name

Patří k druhému nejdůležitějšímu atributu, pokud má být formulář odeslán k nějakému zpracování. Uvádí se do něj text, který může osahovat písmena i číslice a slouží jako název pole za účelem dalšího použití na straně zpracování formuláře.  

required="required"

Dává internetovému prohlížeči pokyn, aby před odesláním formuláře zkontroloval, zda je pole správně vyplněné. Záleží na tom, o jaký druh pole se jedná. Jiné je to u type="email", type="number", atd. Funguje pouze u HTML5, což dnes již nebývá problém.  

Vysvětlení dalších značek ve formuláři

Kam dál

Kurz základy HTML a CSS | Kurz tvorby webových stránek pomocí systému Joomla

Potřebujete pomoci? Žádný problém!

Nevíte si s něčím rady a potřebujete rychlou pomoc odborníka? Můžete se obrátit na nás a my vám dokážeme pomoci i přes internet.

Více o on-line pomoci přes internet se dozvíte zde:

On-line pomoc

Pokud nevíte, neváhejte se zeptat

© HelpMark | Tomáš Herout | Tel: +420 739 719 548