Vyberte volbu Vložit > Spry > Přepínač ověření sady Spry.
Naposledy aktualizováno
19. 5. 2021
Poznámka:
Widgety Spry jsou v aplikaci Dreamweaver CC a novější nahrazeny widgety jQuery. Stávající widgety Spry na stránce sice můžete upravit, ale nemůžete přidávat nové.
O widgetu Přepínač ověření
Widget Přepínač ověření je skupina přepínacích tlačítek s podporou ověření pro výběr. Widget vynutí výběr jednoho tlačítka ze skupiny přepínacích tlačítek.
Následující příklad zobrazuje widget Přepínač ověření v různých stavech.
A. Chybové zprávy widget Přepínač ověření B. Widget Přepínač ověření
Widget Přepínač ověření zahrnuje kromě počátečního stavu ještě další tři stavy. platný, neplatný a vyžadovaná hodnota. Vlastnosti těchto stavů můžete měnit prostřednictvím úprav v příslušném souboru CSS (SpryValidationRadio.css) podle toho, jaké výsledky ověření požadujete. Widget Přepínač ověření může ověřovat v různých okamžicích: když uživatel klepne mimo widget, když vytváří výběry nebo když zkouší odeslat formulář.
Počáteční stav
Stav widgetu, když se stránka načte do prohlížeče nebo když uživatel obnoví formulář.
Platný stav
Stav widgetu, kdy uživatel vytváří výběry a je možné odeslat formulář.
Stav Vyžadováno
Stav widgetu, kdy se uživateli nepodaří vytvořit požadovaný výběr.
Neplatný stav
Stav widgetu, když uživatel vybere přepínací tlačítko, jehož hodnota je nepřijatelná.
Jakmile widget Přepínač ověření vstoupí do jednoho z těchto stavů prostřednictvím uživatelské interakce, logika frameworku Spry za běhu aplikuje na kontejner HTML widgetu specifickou třídu CSS. Pokud uživatel zkusí například odeslat formulář, ale nevytvoří žádný výběr, sada Spry aplikuje na widget třídu, která vyvolá zobrazení chybové zprávy „Proveďte prosím výběr“. Pravidla, která určují styl a zobrazují stavy chybových zpráv, jsou uložena v souboru , který doprovází widget (SpryValidationCheckbox.css).
Výchozí kód HTML pro widget Přepínač ověření (obvykle se nachází uvnitř formuláře) se skládá z kontejnerového tagu span, který ohraničuje tag input type="radio" ze skupiny přepínačů. Výchozí kód HTML pro widget Přepínač ověření zahrnuje v hlavičce dokumentu a za kódem HTML widgetu také tagy skriptu.
Podrobnější popis činnosti widgetu Přepínač ověření, včetně úplné struktury jeho kódu, naleznete na adrese www.adobe.com/go/learn_dw_spryradio_cz.
Vložení a úpravy widgetu Přepínač ověření
Vložení widgetu Přepínač ověření
-
-
Do textového pole Název zadejte název skupiny přepínacích tlačítek.
-
Kliknutím na tlačítka plus (+) nebo minus (-) přidejte nebo odeberte přepínací tlačítka ze skupiny.
-
Ve sloupci Popis klikněte na název každého přepínacího tlačítka (tím se pole stane upravitelným) a každému přepínacímu tlačítku přidělte jedinečný název.
-
Ve sloupci Hodnota klikněte na každou hodnotu (tím se pole stane upravitelným) a každému přepínacímu tlačítku přidělte jedinečnou hodnotu.
-
(Volitelně) Kliknutím na přepínací tlačítko nebo jeho hodnotu vyberte specifický řádek. Řádek potom můžete kliknutím na šipky nahoru a dolů posouvat nahoru a dolů.
-
Vyberte typ rozvržení skupiny přepínačů.
Zalomení řádků
Umístí každé přepínací tlačítko na zvláštní řádek pomocí funkce zalomení řádků (tagy br).
Tabulka
Umístí každé přepínací tlačítko na zvláštní řádek s použitím jednotlivých řádků tabulky (tagy tr).
-
Klepněte na tlačítko OK.
Poznámka:
Widget Přepínač ověření můžete vložit také pomocí kategorie Spry na panelu Vložit.
Určení, kdy proběhne ověření
Okamžik, ve kterém proběhne ověření, můžete nastavit – když uživatel klikne mimo widget, když vytváří výběry nebo když zkouší odeslat formulář.
-
V okně dokumentu klikněte na modrou záložku widgetu Přepínač ověření.
-
V inspektorovi Vlastnosti (Okna > Vlastnosti) vyberte volbu, která určuje, kdy chcete, aby ověření proběhlo. Můžete vybrat všechny volby, nebo pouze volbu Odeslání.
Rozostření
Ověření proběhne pokaždé, když uživatel klepne mimo skupinu přepínačů.
Změna
Ověření proběhne, když uživatel provede výběr.
Odeslání
Ověření v okamžiku, kdy se uživatel pokusí odeslat formulář. Volba Odeslání je vybrána ve výchozím nastavení a její výběr nelze zrušit.
Zobrazení stavů widgetu v zobrazení Návrh
-
V okně dokumentu klikněte na modrou záložku widgetu Přepínač ověření.
-
V inspektoru Vlastnosti (Okna > Vlastnosti) vyberte stav, který chcete vidět v rozbalovací nabídce Náhled stavů. Chcete-li například vidět widget v jeho počátečním stavu, vyberte volbu Výchozí.
Změnit vyžadovaný status přepínacích tlačítek
Ve výchozím nastavení widget Přepínač ověření vyžaduje, aby uživatel před odesláním formuláře vytvořil výběr. Vytvoření výběru ovšem můžete pro uživatele nastavit pouze jako volitelnou funkci.
-
V okně dokumentu klikněte na modrou záložku widgetu Přepínač ověření.
-
V panelu Vlastnosti (Okna > Vlastnosti) zrušte výběr volby Vyžadované.
Určení prázdné nebo neplatné hodnoty
Můžete určit hodnotu, která se zaregistruje jako prázdná nebo neplatná, pokud uživatel vybere přepínací tlačítko, kterému je jedna z těchto hodnot přiřazena. Vybere-li uživatel přepínací tlačítko s prázdnou hodnotou, prohlížeč zobrazí chybovou zprávu „Proveďte prosím výběr“. Vybere-li uživatel přepínací tlačítko s neplatnou hodnotou, prohlížeč zobrazí chybovou zprávu „Vyberte prosím platnou hodnotu“.
-
Ve widgetu Přepínač ověření vyberte přepínací tlačítko, které chcete použít pro prázdné nebo neplatné přepínací tlačítko. Při určování prázdných nebo neplatných hodnot widgetu musí být příslušným přepínacím tlačítkům tyto hodnoty už přiřazeny.
-
V panelu Vlastnosti Přepínače ověření (Okno > Vlastnosti) přiřaďte přepínacímu tlačítku zaškrtnutou hodnotu. Za účelem vytvoření přepínacího tlačítka s prázdnou hodnotou zadejte do textového pole Zaškrtnutá hodnota text žádný. Za účelem vytvoření přepínacího tlačítka s neplatnou hodnotou zadejte do textového pole Zaškrtnutá hodnota text neplatný.
-
Kliknutím na jeho modrou záložku vyberte celý widget Přepínač ověření.
-
V inspektoru Vlastnosti určete prázdné nebo neplatné hodnoty. Chcete-li vytvořit widget, který zobrazí chybovou zprávu o prázdné hodnotě („Proveďte prosím výběr“), zadejte do textového pole Prázdná hodnota text žádný. Chcete-li vytvořit widget, který zobrazí chybovou zprávu o neplatné hodnotě („Vyberte prosím platnou hodnotu“), zadejte do textového pole Neplatná hodnota text neplatný.
Nezapomeňte, že samotnému přepínacímu tlačítku a widgetu Přepínač ověření musí být přiřazena žádná nebo neplatná hodnota, aby se chybové zprávy zobrazovaly bez problémů.
Přizpůsobení widgetu Přepínač ověření
I když vám inspektor Vlastnosti umožňuje jednoduché úpravy widgetu Přepínač ověření, nepodporuje úlohy přizpůsobení stylu. Pro widget Přepínač ověření můžete upravit CSS a vytvořit tak widget, který je stylově upraven podle vašeho vkusu. Seznam pokročilejších úloh nastavení stylu najdete na adrese www.adobe.com/go/learn_dw_spryradio_custom_cz.
Všechna pravidla CSS v níže uvedených tématech se vztahují ke standardním pravidlům umístěným v souboru SpryValidationRadio.css. Aplikace Dreamweaver uloží soubor SpryValidationRadio.css do složky zdrojů Spry webového místa pokaždé, když vytvoříte widget Přepínač ověření sady Spry. Přečtení tohoto souboru je užitečné, protože soubor obsahuje vysvětlující informace o nejrůznějších stylech, které se k widgetu vztahují.
Poznámka:
Ačkoli můžete pravidla pro widget Přepínač ověření snadno upravit přímo v přiloženém souboru CSS, k úpravě CSS widgetu můžete použít také panel Styly CSS. Panel Styly CSS je užitečný k vyhledání tříd CSS přiřazených k různým částem widgetu, zejména pokud používáte režim panelu Současný.
Nastavení stylu widgetu Přepínač ověření (všeobecné pokyny)
-
Otevřete soubor SpryValidationRadio.css.
-
Vyhledejte pravidlo CSS, které se vztahuje k widgetu, který chcete změnit. Chcete-li například změnit barvu pozadí vyžadovaného stavu widgetu Přepínač ověření, upravte v souboru SpryValidationRadio.css pravidlo radioRequiredState.
-
Změňte pravidlo CSS a soubor uložte.
Soubor SpryValidationRadio.css obsahuje podrobné informace, které vysvětlují kódy a účel konkrétních pravidel. Další informace naleznete v komentářích v souboru.
Nastavení stylu textu chybových zpráv widgetu Přepínač ověření
Ve výchozím nastavení se chybové zprávy widgetu Přepínač ověření zobrazují červeně, přičemž text je ohraničen okrajem o šířce 1 obrazového bodu.
-
Chcete-li změnit styl textu chybových zpráv widgetu Přepínač ověření, použijte k vyhledání příslušného pravidla CSS následující tabulku a pak změňte výchozí vlastnosti nebo přidejte svoje vlastnosti a hodnoty stylu textu.
Text k nastavení stylu
Příslušné pravidlo CSS
Příslušné vlastnosti, které se mají změnit
Text chybové zprávy
.radioRequiredState .radioRequiredMsg, .radioInvalidState .radioInvalidMsg color: #CC3333; border: 1px solid #CC3333;
