Poznámka:

V aktualizacích Dreamweaver Creative Cloud byla rozšířena podpora elementů formuláře HTML. Informace najdete v části Rozšířená podpora formátu HTML5 pro elementy formuláře.

O webových formulářích

Když návštěvník zadá informace do webového formuláře zobrazeného ve webovém prohlížeči a klepne na tlačítko odeslání, pošlou se informace na server, kde je zpracuje skript nebo aplikace na straně serveru. Server reaguje odesláním požadovaných informací zpět uživateli (neboli klientovi) nebo provedením nějaké akce založené na obsahu formuláře.

Můžete vytvářet formuláře, které odesílají data do většiny aplikačních serverů včetně PHP, ASP a ColdFusion. Pokud používáte server ColdFusion, můžete do formulářů přidat ovládací prvky formuláře specifické pro ColdFusion.

Poznámka:

Můžete také poslat data formuláře přímo příjemci e-mailu.

Objekty formuláře

V aplikaci Dreamweaver se vstupní typy formulářů nazývají objekty formuláře. Objekty formuláře jsou mechanismy, které uživatelům umožní zadat data. Do formuláře můžete přidat následující objekty formuláře:

Textová pole

Akceptují jakýkoliv typ vstupu s alfanumerickým textem. Text se může zobrazit jako jeden řádek, více řádků a jako pole hesla, kde je zadaný text nahrazený hvězdičkami nebo odrážkami, aby se text skryl před přihlížejícími.

Objekty formuláře

Poznámka:

Hesla a další informace poslané na server pomocí pole hesla nejsou šifrované. Přenesená data mohou být zachycena a přečtena jako alfanumerický text. Z tohoto důvodu byste vždy měli data, která chcete zabezpečit, zašifrovat.

Skrytá pole

Uloží informace zadané uživatelem, například jméno, e‑mailovou adresu nebo předvolbu zobrazení, a pak tato data použijí při příští návštěvě uživatele ve webovém místě.

Tlačítka

Provádějí akce při klepnutí. Můžete zadat vlastní název nebo popis tlačítka nebo použít jeden z předdefinovaných popisů „Odeslat“ nebo „Vymazat“. Použijte tlačítko k odeslání dat formuláře na server nebo k vymazání formuláře. Také můžete tlačítku přiřadit další úlohy zpracování, které definujete ve skriptu. Tlačítko může například vypočítat celkovou cenu vybraných položek na základě přiřazených hodnot.

Zaškrtávací pole

Umožňují více odpovědí v rámci jedné skupiny voleb. Uživatel může vybrat tolik voleb, kolik jich platí. Následující příklad zobrazuje tři vybrané položky zaškrtávacích polí: Surfování, Jízda na horském kole a Rafting.

Zaškrtávací pole

Přepínací tlačítka

Představují výhradní možnosti. Výběr tlačítka ve skupině přepínacích tlačítek zruší výběr všech ostatních tlačítek ve skupině (skupina se skládá ze dvou nebo více tlačítek, která mají stejný název). V následujícím příkladu je Rafting aktuálně vybraná volba. Pokud uživatel klepne na volbu Surfování, tlačítko Rafting se automaticky odznačí.

Přepínací tlačítka

Nabídky seznamu

Zobrazuje hodnoty voleb v rolovacím seznamu, který uživatelům umožní vybrat více voleb. Volba Seznam zobrazí hodnoty voleb v nabídce, která uživatelům umožní vybrat pouze jednu položku. Použijte nabídky, když máte omezený prostor, ale musíte zobrazit mnoho položek nebo kontrolovat hodnoty vrácené serveru. Na rozdíl od textových polí, kde uživatelé mohou zadat cokoliv, co chtějí, včetně neplatných dat, nastavíte přesné hodnoty vrácené nabídkou.

Poznámka:

Rozbalovací nabídka ve formuláři HTML není stejná jako grafická rozbalovací nabídka. Informace o vytvoření, úpravách, zobrazení a skrytí grafické rozbalovací nabídky viz odkaz na konci tohoto oddílu.

Nabídky odkazů

Jsou navigační seznamy nebo rozbalovací nabídky, které umožňují vložit nabídku, ve které každá volba odkazuje na dokument nebo soubor.

Pole pro soubor

Umožní uživatelům procházet k souboru v počítači a odeslat tento soubor jako data formuláře.

Obrazová pole

Umožňují vložit do formuláře obraz. Použijte obrazová pole, chcete-li vytvořit grafická tlačítka, například tlačítka Odeslat nebo Vymazat. Používání obrazu k provedení jiných úloh než odeslání dat vyžaduje připojení chování k objektu formuláře.

Vytvoření formuláře HTML

(Pouze uživatelé služby Creative Cloud): V rámci podpory jazyka HTML5 byly pro prvky formuláře na panelu Vlastnosti přidány nové atributy. V části Formuláře na panelu Vložit byly dále přidány čtyři nové prvky formuláře (E-mail, Hledat, Telefon, URL). Další informace najdete v části Rozšířená podpora formátu HTML5 pro elementy formuláře.

  1. Otevřete stránku a umístěte textový kurzor do místa, kde se má zobrazit formulář.
  2. Vyberte volbu Vložit > Formulář nebo vyberte kategorii Formuláře na panelu Vložit a klepněte na ikonu Formulář.

    V zobrazení Návrh jsou formuláře označené červeným tečkovaným obrysem. Pokud tento obrys nevidíte, vyberte volbu Zobrazení > Vizuální pomůcky > Neviditelné elementy.

  3. v inspektoru Vlastnosti (Okna > Vlastnosti) nastavte vlastnosti formuláře HTML:

    a. V okně dokumentu klepněte na obrys formuláře, abyste formulář vybrali.

    b. Do pole Název formuláře zadejte jednoznačný název označující formulář.

    Pojmenování formuláře umožní odkazovat na formulář nebo ho ovládat skriptovacím jazykem, jako je například JavaScript nebo VBScript. Pokud formulář nepojmenujete, aplikace Dreamweaver vytvoří název pomocí syntaxe formn a zvýší hodnotu n pro každý formulář přidaný na stránku.

    c. V poli Akce určete stránku nebo skript, který bude zpracovávat data formuláře tak, že napíšete cestu nebo klepnete na ikonu složky a přejdete na příslušnou stránku nebo skript. Například: processorder.php.

    d. V rozbalovací nabídce Metoda určete metodu, která přenese data formuláře na server.

    Nastavte libovolné z následujících voleb:

    Výchozí K poslání dat formuláře na server se použije výchozí nastavení prohlížeče. Obvykle je výchozí hodnotou metoda GET.

    GET Připojí hodnotu k adrese URL, která vytváří požadavek pro stránku.

    POST Vloží data formuláře do požadavku HTTP.

    Metodu GET nepoužívejte k posílání dlouhých formulářů. Adresy URL jsou omezené na 8192 znaků. Pokud je množství poslaných dat příliš velké, data se zkrátí a povede to k neočekávaným nebo k chybným výsledkům zpracování.

    Dynamické stránky vytvořené pomocí parametrů předaných metodou GET mohou být označené záložkami, protože všechny hodnoty potřebné k obnovení stránky jsou obsažené v adrese URL zobrazené v poli Adresa v prohlížeči. Naopak dynamické stránky vytvořené pomocí parametrů předaných metodou POST nemohou být označeny záložkami.

    Pokud shromažďujete důvěrná uživatelská jména a hesla, čísla kreditních karet nebo jiné důvěrné informace, metoda POST se může zdát bezpečnější než metoda GET. Ale informace posílané metodou POST nejsou šifrované a hacker je může snadno přečíst. Abyste data zabezpečili, použijte bezpečné připojení k bezpečnému serveru.

     

    e. (Volitelně) V rozbalovací nabídce Typ šifrování určete typ šifrování MIME dat odeslaných serveru ke zpracování.

    Výchozí nastavení application/x-www-form-urlencode se obvykle používá ve spojení s metodou POST. Pokud vytváříte pole pro odeslání souboru, určete typ MIME multipart/form‑data.

     

    f. (Volitelně) V rozbalovací nabídce Cíl určete okno, ve kterém se mají zobrazit data vrácená vyvolaným programem.

    Pokud pojmenované okno ještě není otevřené, otevře se nové okno s tímto názvem. Nastavte libovolnou z následujících hodnot cíle:

    _blank Otevře cílový dokument v novém nepojmenovaném okně.

    _parent Otevře cílový dokument v rodičovském okně okna zobrazujícího aktuální dokument.

    _self Otevře cílový dokument ve stejném okně jako je okno, ze kterého byl formulář odeslaný.

    _top Otevře cílový dokument v základním prostoru aktuálního okna. Tato hodnota se může použít, aby se zajistilo, že cílový dokument převezme celé okno, i když původní dokument byl zobrazený v rámci.

  4. Vložte objekty formuláře na stránku:

    a. Umístěte textový kurzor tam, kde by se měl objekt formuláře ve formuláři zobrazit.

    b. Vyberte objekt v nabídce Vložit > Formulář nebo v kategorii Formuláře na panelu Vložit.

    c. Vyplňte dialogové okno Atributy tagu pro usnadnění přístupu. Více informací získáte kliknutím na tlačítko Nápověda v dialogovém okně.

    Poznámka:

    Pokud dialogové okno Atributy tagu pro usnadnění přístupu nevidíte, je možné, že jste zadali bod vložení v zobrazení kódu, když jste se pokusili o vložení objektu formuláře. Ujistěte se, že bod vložení se nachází v zobrazení návrhu a zkuste to znovu. Další informace o tomto tématu naleznete v článku Davida Powerse na adrese Vytváření formulářů HTML v aplikaci Dreamweaver.

    d. Nastavte vlastnosti objektů.

    e. v inspektoru Vlastnosti zadejte název objektu.

    Každé textové pole, skryté pole, zaškrtávací pole a objekt seznamu/nabídky musí mít jedinečný název, které objekt ve formuláři identifikuje. Názvy objektů formuláře nemohou obsahovat mezery ani speciální znaky. Můžete použít jakoukoliv kombinaci alfanumerických znaků a podtržítko (_). Popis, který přiřadíte k objektu, je název proměnné, ve které se uloží hodnota (zadaná data) pole. To je hodnota poslaná na server ke zpracování.

    Poznámka:

    Všechna přepínací tlačítka ve skupině musí mít stejný název.

    f. Abyste na stránce označili objekt textového pole, zaškrtávacího pole nebo přepínacího tlačítka, klepněte vedle objektu a zadejte popis.

  5. Upravte rozvržení formuláře.

    Chcete-li formátovat formuláře, použijte zalomení řádků, zalomení odstavců, předformátovaný text nebo tabulky. Nemůžete vložit formulář do jiného formuláře (to znamená, že se tagy nemohou překrývat), ale do stránky můžete zahrnout více než jeden formulář.

    Při návrhu formulářů nezapomeňte označit pole formuláře popisným textem, abyste uživatelům umožnili zjistit, na co mají odpovídat – například „Zadejte vaše jméno“ pro požadavek na informace o jméně.

    Použijte tabulky, abyste zadali strukturu pro objekty formuláře a popisy polí. Při použití tabulek ve formulářích zkontrolujte, že jsou všechny tagy tabulky table zahrnuty mezi tagy formuláře form.

Výukovou lekci o vytváření formulářů najdete na adrese www.adobe.com/go/vid0160_cz.

Výukovou lekci o navrhování formulářů pomocí CSS najdete na adrese www.adobe.com/go/vid0161_cz.

Vlastnosti objektu Textové pole

Vyberte objekt textového pole a nastavte libovolné z následujících voleb v inspektoru Vlastnosti:

Šířka znaků

Určuje maximální počet znaků, které mohou být v poli zobrazené. Tento počet může být menší než Max. počet znaků, který určuje maximální počet znaků, které lze do pole zadat. Pokud je například Šířka znaků nastavená na hodnotu 20 (výchozí hodnota) a uživatel zadá 100 znaků, v textovém poli se zobrazí pouze 20 z těchto znaků. Přestože nemůžete zobrazit znaky v poli, objekt pole je rozezná a pošle na server ke zpracování.

Max. počet znaků

Určuje maximální počet znaků, které může uživatel zadat do pole pro jednořádková textová pole. Použijte Max. počet znaků, abyste omezili PSČ na 5 číslic, hesla na 10 znaků a podobně. Pokud necháte pole Max. počet znaků prázdné, uživatelé mohou zadat jakékoliv množství textu. Pokud text přesáhne šířku znaků pole, text bude rolovat. Pokud uživatel přesáhne maximální počet znaků, formulář vydá výstražný zvuk.

Počet řádků

(Dostupné, když je vybraná volba Víceřádkové) Nastavuje výšku pole pro víceřádková textová pole.

Vypnuto

Vypíná textovou oblast.

Pouze ke čtení

Učiní textovou oblast oblastí pouze pro čtení.

Typ

Označí pole jako jednořádkové, víceřádkové nebo pole pro heslo.

Jednořádkové

Výsledkem je tag input s atributem type nastaveným na text. Nastavení Šířky znaků se mapuje na atribut size a nastavení Max. počet znaků se mapuje na atribut maxlength.

Víceřádkové

Výsledkem je tag textarea. Nastavení Šířky znaků se mapuje na atribut cols a nastavení Počet řádků se mapuje na atribut rows.

Heslo

Výsledkem je tag input s atributem type nastaveným na password. Nastavení Šířka znaků a Max. počet znaků se mapuje na stejné atributy jako pro jednořádková textová pole. Když uživatel zapisuje text do textového pole pro heslo, zadání se zobrazí jako odrážky nebo hvězdičky, aby bylo chráněno před sledováním dalšími osobami.

Vých. hodnota

Přiřadí hodnotu, která se zobrazí v poli při prvním načtení formuláře. Můžete například zadat poznámku nebo vzorovou hodnotu a tím naznačit, aby uživatel zadal informace do pole.

Třída

Umožňuje na objekt aplikovat pravidla CSS.

Volby objektu tlačítka

Název tlačítka

Přiřadí tlačítku název. Dva vyhrazené názvy, Odeslat a Vymazat, sdělují formuláři, aby odeslal data formuláře do aplikace nebo skriptu pro zpracování nebo aby vymazal pole formuláře na jejich původní hodnoty.

Hodnota

Určuje text, který se objeví na tlačítku.

Akce

Určuje, co se stane při kliknutí na tlačítko.

Odeslat formulář

Když uživatel klepne na tlačítko, odešle data formuláře ke zpracování. Data jsou odeslána na stránku nebo do skriptu určeného ve vlastnosti Akce formuláře.

Vymazat formulář

Při kliknutí na tlačítko vymaže obsah formuláře.

Žádné

Volba určující akci, která se provede při klepnutí na tlačítko. Můžete například přidat chování v jazyce JavaScript, které otevře jinou stránku, když uživatel klepne na tlačítko.

Třída

Aplikuje na objekt pravidla CSS.

Volby objektu Zaškrtávací pole

Zaškrtnutá hodnota

Nastaví hodnotu, která se pošle na server, když je zaškrtávací pole zaškrtnuté. V dotazníku můžete například nastavit hodnotu 4 pro silný souhlas a hodnotu 1 pro silný nesouhlas.

Počáteční stav

Určuje, zda je zaškrtávací pole vybrané, když se formulář načte do prohlížeče.

Dynamické

Umožní serveru dynamicky určit počáteční stav zaškrtávacího pole. Můžete například použít zaškrtávací pole k vizuální prezentaci informace Ano/Ne uložené v záznamu databáze. V době návrhu tuto informaci neznáte. Za běhu server načte záznam databáze a vybere zaškrtávací pole, pokud je tato hodnota Ano.

Třída

Aplikuje na objekt pravidla CSS.

Volby objektu jednoho přepínacího tlačítka

Zaškrtnutá hodnota

Nastaví hodnotu, která se pošle na server, když je přepínací tlačítko vybrané. Můžete například do pole Zaškrtnutá hodnota zadat lyžování, abyste označili, že uživatel zvolil lyžování.

Počáteční stav

Určuje, zda je přepínací tlačítko vybrané při načtení formuláře do prohlížeče.

Dynamické

Umožní serveru dynamicky určit počáteční stav přepínacího tlačítka. Můžete například použít přepínací tlačítka k vizuální prezentaci informace uložené v záznamu databáze. V době návrhu tuto informaci neznáte. Za běhu server načte záznam databáze a zaškrtne přepínací tlačítko, pokud hodnota souhlasí s hodnotou, kterou jste určili.

Třída

Aplikuje na objekt pravidla CSS.

Seznam/Nabídka

Přiřadí nabídce název. Název musí být jednoznačný.

Typ

Označuje, zda se nabídka při klepnutí rozbalí (volba Nabídka) nebo se zobrazí rolovatelný seznam položek (volba Seznam). Vyberte volbu Nabídka, pokud chcete, aby při zobrazení formuláře v prohlížeči byla viditelná pouze jedna volba. Aby se zobrazily další volby, musí uživatel klepnout na šipku dolů.

Vyberte volbu Seznam, aby se při zobrazení formuláře v prohlížeči zobrazily některé nebo všechny volby a abyste uživatelům umožnili vybrat více položek.

Výška

(Pouze typ Seznam) Nastaví počet položek zobrazených v nabídce.

Výběry

(Pouze typ Seznam) Označuje, zda uživatel může ze seznamu vybrat více položek.

Hodnoty seznamu

Otevře dialogové okno, které umožňuje přidat položky do nabídky formuláře:

  1. Použijte tlačítka plus (+) a minus (-), chcete-li přidat nebo odstranit položky ze seznamu.

  2. Zadejte popisný text a volitelnou hodnotu pro každou položku nabídky.

    Každá položka v seznamu má popis (text, který se zobrazí v seznamu) a hodnotu (hodnota, která se pošle do aplikace ke zpracování, pokud je položka vybraná). Pokud není určená žádná hodnota, pošle se místo toho do aplikace ke zpracování popis.

  3. Použijte tlačítka se šipkou nahoru a dolů, abyste uspořádali položky v seznamu.

    Položky se v nabídce zobrazí ve stejném pořadí, jako se zobrazují v dialogovém okně Hodnoty seznamu. První položka v seznamu je při načtení stránky v prohlížeči vybraná.

Dynamické

Umožní serveru dynamicky vybrat položku v nabídce při jejím prvním zobrazení.

Třída

Umožňuje na objekt aplikovat pravidla CSS.

Na začátku vybrané

Nastaví položky v seznamu, které jsou standardně vybrané. Klepněte na položku nebo položky v seznamu.

Vložení pole pro odeslání souboru

Můžete vytvořit pole pro odeslání souboru, které uživatelům umožní vybrat soubor na jejich počítači – například dokument z textového procesoru nebo grafický soubor – a odeslat tento soubor na server. Pole pro soubor vypadá jako jiná textová pole kromě toho, že také obsahuje tlačítko Procházet. Uživatel buď ručně zadá cestu k souboru, který chce odeslat, nebo použije tlačítko Procházet k nalezení a vybrání souboru.

Před tím, než budete moci použít pole pro odeslání souboru, musíte mít skript na straně serveru nebo stránku schopnou zpracovat odeslané soubory. Podívejte se do dokumentace serverové technologie, kterou používáte ke zpracování dat formuláře. Pokud například používáte PHP, vyhledejte téma „Handling files uploads“ (Zpracování odesílání souborů) v online příručce PHP na adrese http://us2.php.net/features.file-upload.php.

Pole pro soubor vyžadují, abyste k přenosu souborů z prohlížeče na server používali metodu POST. Soubor se odešle na adresu, kterou určíte v poli Akce formuláře.

Poznámka:

Před použitím pole pro soubor kontaktujte správce serveru, aby vám potvrdil, že je povolené anonymní odesílání souborů.

  1. Vložte formulář na stránku (Vložit > Formulář).
  2. Vyberte formulář, abyste zobrazili inspektor Vlastnosti.
  3. Nastavte metodu formuláře na POST.
  4. Z rozbalovací nabídky Typ šifrování vyberte volbu multipart/form-data.
  5. V poli Akce určete skript na straně serveru nebo stránku schopnou zpracovat odeslaný soubor.
  6. Umístěte textový kurzor dovnitř obrysu formuláře a vyberte volbu Vložit > Formulář > Pole pro soubor.
  7. v inspektoru Vlastnosti nastavte libovolné z následujících voleb:

    Název pole pro soubor

    Určuje název objektu pole pro soubor.

    Šířka znaků

    Určuje maximální počet znaků, které mohou být v poli zobrazené.

    Max. počet znaků

    Určuje maximální počet znaků, které pole může obsahovat. Pokud uživatel najde soubor procházením, název souboru a cesta mohou přesáhnout hodnotu určenou v poli Max. počet znaků. Pokud se ale uživatel pokusí zadat název souboru a cestu, pole pro soubor povolí pouze počet znaků určený hodnotou Max. počet znaků.

Vložení obrazového tlačítka

Jako ikony tlačítek můžete použít obrazy. Používání obrazu k provedení jiných úloh než odeslání dat vyžaduje připojení chování k objektu formuláře.

  1. V dokumentu umístěte textový kurzor uvnitř obrysu formuláře.
  2. Vyberte volbu Vložit > Formulář > Obrazové pole.

    Zobrazí se dialogové okno Vybrat zdroj obrazu.

  3. Vyberte obraz pro tlačítko v dialogovém okně Vybrat zdroj obrazu a klepněte na tlačítko OK.
  4. v inspektoru Vlastnosti nastavte libovolné z následujících voleb:

    Pole obrazu

    Přiřadí tlačítku název. Dva vyhrazené názvy, Odeslat a Vymazat, sdělují formuláři, aby odeslal data formuláře do aplikace nebo skriptu pro zpracování nebo aby vymazal pole formuláře na jejich původní hodnoty.

    Zdroj

    Určuje obraz, který chcete pro tlačítko použít.

    Alt

    Umožňuje zadat popisný text pro případ, že se v prohlížeči nepodaří načíst obraz.

    Zarovnání

    Nastaví atribut zarovnání objektu.

    Upravit obraz

    Spustí výchozí editor obrazu a otevře soubor obrázku pro úpravy.

    Třída

    Umožňuje na objekt aplikovat pravidla CSS.

  5. Chcete-li k tlačítku připojit chování v jazyku JavaScript, vyberte obraz a pak vyberte chování v panelu Chování (Okna > Chování).

Volby objektu skrytého pole

Skryté pole

Určuje název pole.

Hodnota

Přiřazuje poli hodnotu. Tato hodnota se při odeslání formuláře předá serveru.

Vložení skupiny přepínacích tlačítek

  1. Umístěte textový kurzor dovnitř obrysu formuláře.
  2. Vyberte volbu Vložit > Formulář > Skupina přepínacích tlačítek.

  3. Vyplňte dialogové okno a klikněte na tlačítko OK.

    a. Do pole Název zadejte název skupiny přepínacích tlačítek.

     Pokud nastavíte přepínací tlačítka, aby předala parametry zpět serveru, parametry budou spojené s názvem. Pokud například pojmenujete skupinu mojeSkupina a nastavíte metodu formuláře GET (to znamená, že chcete, aby formulář předal parametry URL místo parametrů formuláře, když uživatel klepne na tlačítko odeslání), výraz mojeSkupina="ZaškrtnutáHodnota" bude předán na server v URL.

    b. Klepněte na tlačítko plus (+), abyste do skupiny přidali přepínací tlačítko. Zadejte popis a zaškrtnutou hodnotu pro nové tlačítko.

    c. Klepněte na šipku nahoru nebo dolů, abyste tlačítka uspořádali.

    d. Chcete-li nastavit, že při otevření stránky v prohlížeči bude vybrané určité přepínací tlačítko, zadejte hodnotu stejnou jako je hodnota přepínacího tlačítka v poli Vybrat hodnotu rovnající se.

    Zadejte statickou hodnotu nebo určete dynamickou hodnotu klepnutím na ikonu s bleskem vedle pole a vyberte sadu záznamů, která obsahuje možné zaškrtnuté hodnoty. V obou případech by hodnota, kterou určíte, měla souhlasit se zaškrtnutou hodnotou jednoho z přepínacích tlačítek ve skupině. Abyste zobrazili zaškrtnuté hodnoty přepínacích tlačítek, vyberte každé přepínací tlačítko a otevřete inspektor Vlastnosti (Okna > Vlastnosti).

    e. Vyberte formát, který chcete použít pro rozvržení tlačítek v aplikaci Dreamweaver. Nastavte rozvržení tlačítek pomocí zalomení řádků nebo pomocí tabulky. Pokud vyberete volbu tabulky, aplikace Dreamweaver vytvoří tabulku s jedním sloupcem a umístí přepínací tlačítka nalevo a popisy napravo.

    Také můžete nastavit vlastnosti v inspektoru Vlastnosti nebo přímo v zobrazení Kód.

Vložit skupinu zaškrtávacích polí

  1. Umístěte textový kurzor dovnitř obrysu formuláře.
  2. Vyberte volbu Vložit > Formulář > Skupina zaškrtávacích polí.

  3. Vyplňte dialogové okno a klikněte na tlačítko OK.

    a. Do pole Název zadejte název skupiny zaškrtávacích polí.

    Pokud nastavíte zaškrtávací pole, aby předala parametry zpět serveru, parametry budou spojené s názvem. Pokud například pojmenujete skupinu mojeSkupina a nastavíte metodu formuláře GET (to znamená, že chcete, aby formulář předal parametry URL místo parametrů formuláře, když uživatel klepne na tlačítko odeslání), výraz mojeSkupina="ZaškrtnutáHodnota" bude předán na server v URL.

    b. Klepnutím na tlačítko plus (+) přidáte do skupiny zaškrtávací pole. Zadejte popis a zaškrtnutou hodnotu pro nové zaškrtávací pole.

    c. Klepnutím na šipku nahoru nebo dolů změníte uspořádání zaškrtávacích polí.

    d. Chcete-li nastavit, aby se při otevření stránky v prohlížeči vybralo určité zaškrtávací pole, zadejte hodnotu odpovídající hodnotě zaškrtávacího pole do pole Vybrat hodnotu rovnající se.

    Zadejte statickou hodnotu nebo určete dynamickou hodnotu klepnutím na ikonu s bleskem vedle pole a vyberte sadu záznamů, která obsahuje možné zaškrtnuté hodnoty. V obou případech by hodnota, kterou určíte, měla souhlasit se zaškrtnutou hodnotou jednoho ze zaškrtávacích polí ve skupině. Abyste zobrazili zaškrtnuté hodnoty zaškrtávacích polí, vyberte každé zaškrtávací pole a otevřete inspektor Vlastnosti (Okna > Vlastnosti).

    e. Vyberte formát, která chcete použít pro rozvržení zaškrtávacích polí v aplikaci Dreamweaver.

    Nastavte rozvržení zaškrtávacích polí pomocí zalomení řádků nebo pomocí tabulky. Pokud vyberete volbu tabulky, aplikace Dreamweaver vytvoří tabulku s jedním sloupcem a umístí zaškrtávací pole nalevo a popisy napravo.

    Také můžete nastavit vlastnosti v inspektoru Vlastnosti nebo přímo v zobrazení Kód.

O dynamických objektech formulářů

Dynamický objekt formuláře je objekt formuláře, jehož počáteční stav určuje server, když je stránka vyžádaná ze serveru, ne návrhář formuláře v době návrhu. Když si například uživatel vyžádá stránku PHP, která obsahuje formulář s nabídkou, skript PHP ve stránce automaticky vyplní nabídku hodnotami uloženými v databázi. Server pak pošle vyplněnou stránku do prohlížeče uživatele.

Změna objektů formuláře na dynamické může zjednodušit údržbu webového místa. Mnoho webových míst například používá nabídky, aby uživatelům nabídly sadu možností. Pokud je nabídka dynamická, můžete přidat, odstranit nebo změnit položky nabídky na jednom místě – v tabulce databáze, ve které jsou položky uložené – aby se ve webovém místě aktualizovaly všechny výskyty stejné nabídky.

Vložení nebo změna dynamické nabídky formuláře HTML

Nabídku nebo nabídku seznamu formuláře HTML můžete dynamicky vyplnit položkami z databáze. Pro většinu stránek můžete použít objekt nabídky HTML.

Než začnete, musíte vložit formulář HTML na stránku ColdFusion, PHP nebo ASP a musíte pro nabídku definovat sadu záznamů nebo jiný zdroj dynamického obsahu.

  1. Vložte objekt seznamu/nabídky formuláře HTML do stránky:

        a. Klepněte na stránce do formuláře HTML (Vložit > Formulář > Formulář).

        b. Vyberte volbu Vložit > Formulář > Seznam/nabídka, abyste vložili objekt formuláře.

  2. Proveďte jeden z následujících úkonů:

    • Vyberte nový nebo existující objekt seznamu/nabídky formuláře HTML a pak klepněte na tlačítko Dynamické v inspektoru Vlastnosti.

    • Vyberte volbu Vložit > Objekty dat > Dynamická data > Dynamický seznam pro výběr.

  3. Vyplňte dialogové okno Dynamický seznam/nabídka a klepněte na tlačítko OK.

      a. V rozbalovací nabídce Volby ze sady záznamů vyberte sadu záznamů, kterou chcete použít jako zdroj obsahu. Tuto nabídku také později použijete k úpravám položek statického i dynamického seznamu/nabídky.

      b. V oblasti Statické volby zadejte výchozí položku v seznamu nebo nabídce. Tuto volbu také použijete k úpravám statických položek v objektu seznamu/nabídky formuláře po přidání dynamického obsahu.

      c. (Volitelně) Pomocí tlačítek plus (+) a minus (-) přidejte nebo odstraňte položky ze seznamu. Položky jsou ve stejném pořadí jako v dialogovém okně Počáteční hodnoty seznamu. První položka v seznamu je při načtení stránky v prohlížeči vybraná. Použijte tlačítka se šipkou nahoru a dolů, abyste uspořádali položky v seznamu.

      d. V rozbalovací nabídce Hodnoty vyberte pole obsahující hodnoty položek nabídky.

      e. V rozbalovací nabídce Popisy vyberte pole obsahující popisy položek nabídky.

      f. (Volitelně) Abyste určili, že při otevření stránky v prohlížeči nebo při zobrazení záznamu ve formuláři bude vybraná konkrétní položka nabídky, zadejte hodnotu rovnající se hodnotě položky nabídky v poli Vybrat hodnotu rovnající se.

        Můžete zadat statickou hodnotu nebo můžete určit dynamickou hodnotu kliknutím na ikonu s bleskem vedle pole a vybrat dynamickou hodnotu ze seznamu zdrojů dat. V obou případech by hodnota, kterou určíte, měla souhlasit s jednou z hodnot položek nabídky.

     

Změna stávajících nabídek formuláře HTML na dynamické

  1. V zobrazení Návrh vyberte objekt formuláře seznam/nabídka.
  2. v inspektoru Vlastnosti klepněte na tlačítko Dynamické.
  3. Vyplňte dialogové okno a klepněte na tlačítko OK.

Zobrazení dynamického obsahu v textových polích HTML

Při zobrazení formuláře v prohlížeči můžete v textových polích HTML zobrazit dynamický obsah.

Než začnete, musíte vytvořit formulář na stránce ColdFusion, PHP nebo ASP a musíte pro textové pole definovat sadu záznamů nebo jiný zdroj dynamického obsahu.

  1. Vyberte textové pole ve formuláři HTML na stránce.
  2. v inspektoru Vlastnosti klepněte na ikonu s bleskem vedle pole Poč. hodnota, abyste zobrazili dialogové okno Dynamická data.
  3. Vyberte sloupec sady záznamů, ze kterého se získá hodnota textového pole, a pak klepněte na tlačítko OK.

Nastavení voleb v dialogovém okně Dynamické textové pole

  1. Z rozbalovací nabídky Textové pole vyberte textové pole, které chcete změnit na dynamické.
  2. Klepněte na ikonu s bleskem vedle pole Nastavit hodnotu na, vyberte zdroj dat ze seznamu zdrojů dat a klepněte na tlačítko OK.

    Zdroj dat by měl obsahovat textové informace. Pokud se v seznamu nezobrazí žádné zdroje dat nebo pokud zdroje dat, které jsou k dispozici, nesplňují vaše požadavky, klepněte na tlačítko plus (+), a definujte nový zdroj dat.

Dynamický předběžný výběr zaškrtávacího pole HTML

Můžete server nechat, aby rozhodl, zda při zobrazení formuláře v prohlížeči bude zaškrtávací pole vybrané.

Než začnete, musíte vytvořit formulář na stránce ColdFusion, PHP nebo ASP a musíte pro zaškrtávací pole definovat sadu záznamů nebo jiný zdroj dynamického obsahu. V ideálním případě by měl zdroj obsahu obsahovat boolovská data, jako je Ano/Ne nebo true/false.

  1. Vyberte na stránce objekt formuláře zaškrtávací pole.
  2. v inspektoru Vlastnosti klepněte na tlačítko Dynamické.
  3. Vyplňte dialogové okno Dynamické zaškrtávací pole a klepněte na tlačítko OK:
    • Klepněte na ikonu s bleskem vedle pole Zaškrtnout, když a vyberte pole ze seznamu zdrojů dat.

      Zdroj dat musí obsahovat boolovská data jako například AnoNe nebo truefalse. Pokud se v seznamu nezobrazí žádné zdroje dat nebo pokud zdroje dat, které jsou k dispozici, nesplňují vaše požadavky, klepněte na tlačítko plus (+), a definujte nový zdroj dat.

    • V poli Rovná se zadejte hodnotu, kterou pole musí mít, aby se zaškrtávací pole zobrazilo jako vybrané.

      Aby se například zobrazilo zaškrtávací pole jako vybrané, když má určité pole v záznamu hodnotu Ano, zadejte Ano do pole Rovná se.

    Poznámka:

    Tato hodnota se také vrátí serveru, pokud uživatel klepne na tlačítko formuláře Odeslat.

Dynamický předběžný výběr přepínacího tlačítka HTML

Při zobrazení formuláře HTML v prohlížeči dynamicky předběžně vyberte přepínací tlačítko HTML.

Před tím, než začnete, musíte vytvořit formulář na stránce ColdFusion, PHP nebo ASP a vložit alespoň jednu skupinu přepínacích tlačítek HTML (Vložit > Formulář > Skupina přepínacích tlačítek). Pro přepínací tlačítka musíte také definovat sadu záznamů nebo jiný zdroj dynamického obsahu. V ideálním případě by měl zdroj obsahu obsahovat booleovská data, jako je Ano/Ne nebo true/false.

  1. V zobrazení Návrh vyberte přepínací tlačítko ve skupině přepínacích tlačítek.
  2. v inspektoru Vlastnosti klepněte na tlačítko Dynamické.
  3. Vyplňte dialogové okno Dynamická skupina přepínacích tlačítek a klepněte na tlačítko OK.

Nastavení voleb v dialogovém okně Dynamická skupina přepínacích tlačítek

  1. V rozbalovací nabídce Skupina přepínacích tlačítek vyberte formulář a skupinu přepínacích tlačítek na stránce.

    Pole Hodnota přepínacího tlačítka zobrazuje hodnoty všech přepínacích tlačítek ve skupině.

  2. Vyberte hodnotu pro dynamický předběžný výběr ze seznamu hodnot. Tato hodnota se zobrazí v poli Hodnota.
  3. Klepněte na ikonu s bleskem vedle pole Vybrat hodnotu rovnající se a vyberte sadu záznamů, která obsahuje možné zaškrtnuté hodnoty pro přepínací tlačítka ve skupině.

    Sada záznamů, kterou vyberete, obsahuje hodnoty, které souhlasí se zaškrtnutými hodnotami tlačítek. Abyste zobrazili zaškrtnuté hodnoty přepínacích tlačítek, vyberte každé přepínací tlačítko a otevřete inspektor Vlastnosti (Okna > Vlastnosti).

  4. Klepněte na tlačítko OK.

Nastavení voleb v dialogovém okně Dynamická skupina přepínacích tlačítek (ColdFusion)

  1. Vyberte skupinu přepínacích tlačítek a formulář z rozbalovací nabídky Skupina přepínacích tlačítek.
  2. Klepněte na ikonu s bleskem vedle pole Vybrat hodnotu rovnající se.
  3. Vyplňte dialogové okno Dynamická data a klepněte na tlačítko OK.

      a. Ze seznamu zdrojů dat vyberte zdroj dat.

      b. (Volitelně) Vyberte formát dat pro text.

      c. (Volitelně) Upravte kód, který aplikace Dreamweaver vloží do stránky, aby se zobrazil dynamický text.

  4. Klepněte na tlačítko OK, abyste zavřeli dialogové okno Dynamická skupina přepínacích tlačítek, a vložili vyhrazené místo pro dynamický obsah ve skupině přepínacích tlačítek.

Ověření dat formuláře HTML

Aplikace Dreamweaver může přidat kód JavaScript, který zkontroluje obsah určených textových polí, aby ověřila, že uživatel zadal správný typ dat.

K vytvoření vašich formulářů a ověření obsahu určených elementů formuláře můžete použít widgety formuláře Spry. Další informace najdete v tématech Spry uvedených dále.

V aplikaci Dreamweaver můžete také vytvářet formuláře ColdFusion, které ověří obsah určených polí. Další informace najdete v tématech ColdFusion uvedených dále.

  1. Vytvořte formulář HTML, který obsahuje alespoň jedno textové pole a jedno tlačítko Odeslat.

    Zkontrolujte, že každé textové pole, které chcete ověřit, má jedinečný název.

  2. Vyberte tlačítko pro odeslání.
  3. V panelu Chování (Okna > Chování) klepněte na tlačítko plus (+) a ze seznamu vyberte chování Ověřit formulář.
  4. Nastavte pravidla ověření pro každé textové pole a klepněte na tlačítko OK.

    Můžete například určit, že textové pole pro věk osoby akceptuje pouze čísla.

    Poznámka:

    Chování Ověřit formulář je k dispozici, pouze pokud bylo do dokumentu vloženo textové pole.

Připojení chování jazyka JavaScript k objektům formuláře HTML

K objektům formuláře HTML, například k tlačítkům, můžete připojit chování v jazyce JavaScript, uložené v aplikaci Dreamweaver.

  1. Vyberte objekt formuláře HTML.
  2. V panelu Chování (Okna > Chování) klepněte na tlačítko plus (+) a ze seznamu vyberte chování.

Připojení vlastních skriptů k tlačítkům formuláře HTML

Některé formuláře používají jazyk JavaScript nebo VBScript ke zpracování formuláře nebo provedení nějaké jiné akce na straně klienta na rozdíl od odeslání dat formuláře na server ke zpracování. Aplikaci Dreamweaver můžete použít ke konfiguraci tlačítka formuláře pro spuštění určitého skriptu na straně klienta, když uživatel klepne na tlačítko.

  1. Ve formuláři vyberte tlačítko Odeslat.
  2. V panelu Chování (Okna > Chování) klepněte na tlačítko plus (+) a ze seznamu vyberte volbu Zavolat JavaScript.
  3. V poli Zavolat JavaScript zadejte název funkce jazyka JavaScript, která se spustí, když uživatel klepne na tlačítko, a klepněte na tlačítko OK.

    Můžete například zadat název funkce, která ještě neexistuje, například zpracovatMujFormular().

  4. Pokud funkce jazyka JavaScript ještě v sekci head dokumentu neexistuje, přidejte ji nyní.

    Mohli byste například definovat následující funkci jazyka JavaScript v sekci head dokumentu, aby se zobrazila zpráva, když uživatel klepne na tlačítko Odeslat:

    function processMyForm(){ 
        alert('Thanks for your order!'); 
    }

Vytváření přístupných formulářů HTML

Když vložíte objekt formuláře HTML, můžete změnit objekt formuláře na snadno přístupný a změnit atributy usnadnění přístupu později.

Přidání snadno přístupného objektu formuláře

  1. Když poprvé přidáváte snadno přístupné objekty formuláře, aktivujte pro objekty formuláře dialogové okno Usnadnění přístupu (viz část Optimalizace pracovní plochy pro vizuální vývoj).

    Tento krok se provádí pouze jednou.

  2. V dokumentu umístěte textový kurzor do místa, kam chcete vložit objekt formuláře.
  3. Vyberte volbu Vložit > Formulář a vyberte objekt formuláře, který chcete vložit.

    Zobrazí se dialogové okno Atributy tagu pro usnadnění přístupu.

  4. Vyplňte dialogové okno a klepněte na tlačítko OK. Zde je částečný seznam voleb:

    Poznámka:

    Program pro čtení z obrazovky přečte název, které pro objekt zadáte jako atribut Popis.

    Identifikátor

    Přiřadí poli formuláře identifikátor. Tato hodnota se může použít jako odkaz na pole z jazyka JavaScript; také se používá jako hodnota pro atribut for, pokud zvolíte volbu Připojit tag popisu s použitím for pod volbami Styl.

    Uzavření do tagu popisu

    Uzavře tag popisu okolo položky formuláře následujícím způsobem:

    <label> <input type="radio" name="radiobutton" value="radiobutton"> RadioButton1</label>

    Připojení tagu popisu s použitím pro

    Použije atribut for pro uzavření tagu popisu okolo položky formuláře následujícím způsobem:

    <input type="radio" name="radiobutton" value="radiobutton" id="radiobutton"> <label for="radiobutton">RadioButton2</label>

    Tato volba způsobí, že prohlížeč vykreslí text připojený k zaškrtávacímu poli a přepínací tlačítko s rámečkem kolem aktivního pole a povolí uživateli vybrat zaškrtávací pole a přepínací tlačítko kliknutím kdekoliv v připojeném textu místo klepnutí pouze na ovladač zaškrtávacího pole nebo přepínacího tlačítka.

    Poznámka: To je preferovaná volba pro usnadnění přístupu; ale funkčnost se může lišit v závislosti na prohlížeči.

    Žádný tag popisu

    Nepoužije tag popisu následujícím způsobem:

    <input type="radio" name="radiobutton" value="radiobutton"> RadioButton3

    Přístupová klávesa

    K výběru objektu formuláře v prohlížeči použije klávesový ekvivalent (jedno písmeno) a klávesu Alt (Windows) nebo klávesu Ctrl (Macintosh). Pokud například jako přístupovou klávesu zadáte B, uživatelé prohlížeče v systému Macintosh by mohli zadat Ctrl+B, aby vybrali tento objekt formuláře.

    Pořadové číslo

    Určuje pořadí procházení polí pomocí tabulátoru pro objekty formuláře. Pokud nastavíte pořadí procházení pro jeden objekt, musíte nastavit pořadí procházení polí pomocí tabulátoru pro všechny objekty.

    Nastavení pořadí procházení pomocí tabulátoru je užitečné, když máte na stránce další odkazy a objekty formuláře a potřebujete, aby jimi uživatel procházel v určitém pořadí.

  5. Klepněte na tlačítko Ano, abyste vložili tag formuláře.

    Objekt formuláře se zobrazí v dokumentu.

    Poznámka:

    Pokud stisknete tlačítko Zrušit, objekt formuláře se zobrazí v dokumentu, ale aplikace Dreamweaver k němu nepřipojí tagy ani atributy pro usnadnění přístupu.

Úpravy hodnot usnadnění přístupu pro objekt formuláře

  1. V okně dokumentu vyberte objekt.
  2. Proveďte jeden z následujících úkonů:
    • Upravte příslušné atributy v zobrazení Kód.

    • Klepněte pravým tlačítkem (Windows) nebo s klávesou Ctrl (Macintosh) a pak vyberte volbu Upravit tag.

Tato práce podléhá licenci Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.  Na příspěvky ze služeb Twitter™ a Facebook se nevztahují podmínky licence Creative Commons.

Právní upozornění   |   Zásady ochrany osobních údajů online