IT rekvalifikace s garancí práce. Seniorní programátoři vydělávají až 160 000 Kč/měsíc a rekvalifikace je prvním krokem. Zjisti, jak na to!
Hledáme nové posily do ITnetwork týmu. Podívej se na volné pozice a přidej se do nejagilnější firmy na trhu - Více informací.

input typu file - Český HTML 5 manuál

Element <input> se používá ve formulářích, kde umožňuje uživateli vkládat data. Může mít mnoho podob, které se liší různým nastavením atributu type.

Input typu file umožňuje k formuláři připojit soubor. Ten se poté odešle spolu s formulářem.

Atributy:

  • accept - Umožňuje určit MIME typy souborů, které je přípustné vybrat. Můžeme využít speciálních hodnot audio/*, video/* a image/*. Dále můžeme samozřejmě uvést klasické MIME typy jako např. image/jpeg nebo text/plain. Je možné uvést více hodnot, které oddělíme čárkou.
  • multiple - Atribut je typu boolean. Pokud je uveden, je možné vybrat více souborů.

Pozor, pokud formulář obsahuje <input> typu file, je nutné, aby byl atribut enctype formuláře nastaven na hodnotu multipart/form-data.

Následující atributy jsou společné pro všechny typy inputů:

  • 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.
  • disabled - Atribut je typu boolean. Pokud je uveden, nelze měnit hodnotu elementu a ten je často zobrazen jako zašedlý.
  • list - Obsahuje id elementu datalist, položky listu poté slouží jako předdefinované možnosti <input> elementu.
  • readonly - Atribut je typu boolean. Pokud je uveden, nelze hodnoty v daném poli editovat.
  • name - Definuje jméno elementu. Jméno musí být unikátní vzhledem k formuláři a je po odeslání použito jako klíč v dvojici klíč-hodnota, která se na server odešle.
  • value - Přednastavená hodnota pole.
  • autofocus - Atribut je typu boolean. Pokud je uveden, element se zaktivní po načtení stránky.
  • form - Element může být definován mimo formulář a následně být k tomuto formuláři připojen uvedením atributu form s hodnotou id formuláře. Element může patřit více formulářům.
  • pattern - Obsahuje regulární výraz, podle kterého se má hodnota v poli validovat.
  • placeholder - Definuje text, který se zobrazí v případě, že je pole prázdné. Obvykle je vykreslen zašedle a slouží jako nápověda.
  • required - Atribut je typu boolean. Pokud je uveden, znamená to, že pole musí být pro odeslání formuláře vyplněné.

Ukázka nahrání souborů na web pomocí inputu typu file:

Připoj obrázek s tvojí originální podobou:<br />
<input type="file" name="foto" accept="image/*" />

Výsledek:

Ukázka formulářového pole input typu file - Formuláře - Český HTML 5 manuál

Pozor! Nemůžeme se spoléhat na to, že uživatel soubor daného typu neodešle. HTML stránka je na jeho počítači a on si může formulář přepsat a odeslat nám něco, co nechceme. S tím musí skript na druhé straně počítat a data stejně znovu zvalidovat!


 

Všechny články v sekci
Formuláře - Český HTML 5 manuál
Článek pro vás napsal David Hartinger
Avatar
Uživatelské hodnocení:
1 hlasů
David je zakladatelem ITnetwork a programování se profesionálně věnuje 15 let. Má rád Nirvanu, nemovitosti a svobodu podnikání.
Unicorn university David se informační technologie naučil na Unicorn University - prestižní soukromé vysoké škole IT a ekonomie.
Aktivity