Vyberte volbu Vložit > Spry > Potvrzení 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 Potvrzení ověření
widget Potvrzení ověření je textové pole nebo pole formuláře hesla, které zobrazuje platné nebo neplatné stavy, když uživatel zadá hodnotu, která se neshoduje s hodnotou podobného pole v tom samém formuláři. Můžete například přidat widget Potvrzení ověření k formuláři, v němž uživatel musí znovu zadat heslo, které zadal do předchozího pole. Nepodaří-li se uživateli zadat heslo přesně tak, jak ho zadal původně, widget zobrazí chybovou zprávu s oznámením, že se hodnoty neshodují.
Widget Potvrzení ověření můžete také použít v kombinaci s widgetem Ověření textového pole a ověřovat tak e-mailové adresy.
Poznámka:
Než začnete pracovat s widgetem Potvrzení, seznamte se s widgety ověření sady Spry. Pokud s nimi nejste obeznámeni, než budete dále pokračovat, podívejte se nejprve do části Práce s widgetem Ověření textového pole Spry nebo do kteréhokoli jiného přehledu widgetů ověření. Tento přehled neobsahuje všechny základní informace o widgetech ověření.
Následující příklad ukazuje typické nastavení widgetu Potvrzení.
A. Pole pro heslo nebo widget Heslo ověření sady Spry B. widget Potvrzení
widget Potvrzení ověření obsahuje řadu stavů (například platný, neplatný, vyžadovaný atd.). Vlastnosti těchto stavů můžete měnit prostřednictvím úprav v příslušném souboru CSS (SpryValidationConfirm.css) podle toho, jaké výsledky ověření požadujete. widget Potvrzení ověření může ověřovat v různých okamžicích – například, když návštěvník webové stránky klepne mimo widget, když píše nebo když se snaží odeslat formulář.
Počáteční stav
Stav widgetu, když se stránka načte do prohlížeče nebo když uživatel obnoví formulář.
Stav aktivace
Stav widgetu, když uživatel umístí textový kurzor do widgetu.
Platný stav
Stav widgetu, kdy uživatel správně zadá informace a formulář je možné odeslat.
Neplatný stav
Stav widgetu, kdy uživatel zadal text, který se neshoduje s textem zadaným do předchozího textového pole, widgetu Ověření textového pole nebo widgetu Heslo ověření.
Stav Vyžadováno
Stav widgetu, kdy se uživateli nepodaří zadat do textového pole vyžadovaný text.
Podrobnější vysvětlení činnosti widgetu Potvrzení ověření, včetně dalších informací o jeho struktuře, najdete na adrese www.adobe.com/go/learn_dw_spryconfirm_cz.
Vložení a úpravy widgetu Potvrzení ověření
Vložení widgetu Potvrzení ověření
-
-
Vyplňte dialogové okno Atributy tagu vstupu pro usnadnění přístupu a klepněte na tlačítko OK.
Poznámka:
widget Potvrzení ověření můžete vložit také pomocí kategorie Spry na panelu Vložit.
Změna vyžadovaného stavu widgetu Potvrzení ověření
Všechny widgety Potvrzení ověření, které vkládáte pomocí aplikace Dreamweaver, vyžadují při publikaci na webové stránce standardní uživatelské zadání. Vyplnění potvrzovacích textových polí ale můžete pro uživatele nastavit pouze jako volitelnou funkci.
-
V okně dokumentu klikněte na modrou záložku widgetu Potvrzení ověření.
-
V inspektoru Vlastnosti (Okno > Vlastnosti) podle požadavků vyberte volbu Vyžadované nebo její výběr zrušte.
Určení textového pole, podle něhož se bude ověřovat platnost
-
V okně dokumentu klikněte na modrou záložku widgetu Potvrzení ověření.
-
V inspektoru Vlastnosti (Okno > Vlastnosti) vyberte z rozbalovací nabídky Ověřit platnost podle textové pole, podle něhož chcete ověřovat platnost. V rozbalovací nabídce se jako volby objeví všechna textová pole, kterým byl přidělen jedinečný atribut ID.
Zobrazení stavů widgetu v zobrazení Návrh
-
V okně dokumentu klikněte na modrou záložku widgetu Potvrzení ověření.
-
V inspektoru Vlastnosti (Okna > Vlastnosti) vyberte stav, který chcete vidět v rozbalovací nabídce Náhled stavů. Pokud například chcete vidět widget v jeho platném stavu, vyberte volbu Platný.
Určení, kdy proběhne ověření
Okamžik, ve kterém proběhne ověření, můžete nastavit – když návštěvník webu klikne mimo widget, když návštěvník zapisuje nebo když zkouší odeslat formulář.
-
V okně dokumentu klikněte na modrou záložku widgetu Potvrzení 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 potvrzovací textové pole.
Změna
Ověření proběhne, jakmile uživatel změní text v potvrzovacím textovém poli.
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.
Přizpůsobení widgetu Potvrzení ověření
I když vám inspektor Vlastnosti umožňuje jednoduché úpravy widgetu Potvrzení ověření, nepodporuje úlohy přizpůsobení stylu. Pro widget Potvrzení ověření můžete upravit CSS a vytvořit tak widget, který je stylově upraven podle vašich potřeb. Seznam pokročilejších úloh nastavení stylu najdete na adrese www.adobe.com/go/learn_dw_spryconfirm_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 SpryValidationConfirm.css. Aplikace Dreamweaver uloží soubor SpryValidationConfirm.css do složky zdrojů Spry webového místa pokaždé, když vytvoříte widget Potvrzení 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:
I když můžete pravidla pro widget Potvrzení 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 Potvrzení ověření (všeobecné pokyny)
-
Otevřete soubor SpryValidationConfirm.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 Potvrzení ověření, upravte v souboru SpryValidationConfirm.css pravidlo input.confirmRequiredState .
-
Proveďte změny v CSS a soubor uložte.
Soubor SpryValidationConfirm.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 Potvrzení ověření
Standardně se chybové zprávy widgetu Potvrzení 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 Potvrzení 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, který chcete změnit
Příslušné pravidlo CSS
Příslušné vlastnosti, které se mají změnit
Text chybové zprávy
.confirmRequiredState .confirmRequiredMsg, .confirmInvalidState .confirmInvalidMsg color: #CC3333; border: 1px solid #CC3333;
Změna barev pozadí widgetu Potvrzení ověření
-
Chcete-li změnit barvy pozadí widgetu Potvrzení ověření v různých stavech, použijte k vyhledání příslušného pravidla CSS následující tabulku a pak změňte standardní hodnoty barvy pozadí.
Barva, kterou chcete změnit
Příslušné pravidlo CSS
Příslušná vlastnost, kterou chcete změnit
Barva pozadí widgetu v platném stavu
.confirmValidState input, input.confirmValidState background-color: #B8F5B1;
Barva pozadí widgetu v neplatném stavu
input.confirmRequiredState, .confirmRequiredState input, input.confirmInvalidState, .confirmInvalidState input background-color: #FF9F9F;
Barva pozadí widgetu při aktivaci
.confirmFocusState input, input.confirmFocusState background-color: #FFFFCC;
