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é.
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.
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).
Widget Přepínač ověření můžete vložit také pomocí kategorie Spry na panelu Vložit.
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ář.
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.
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.
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“.
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ů.
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í.
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ý.
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.
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; |
Přihlaste se ke svému účtu.