Spry-widgetar ersätts med jQuery-widgetar i Dreamweaver CC och senare. Du kommer även fortsättningsvis att kunna ändra befintliga Spry-widgetar på din sida, men du kan inte lägga till nya.
Widgeten Kryssruta för Spry-validering är en kryssruta eller grupp med kryssrutor i HTML-format som visar giltiga eller ogiltiga lägen när användaren markerar eller inte markerar en kryssruta. Du kan t.ex. lägga till widgeten Kryssruta för validering i ett formulär där en användare måste göra tre val. Om användaren inte göra alla tre valen visar widgeten ett meddelande om att det lägsta antalet val inte har uppfyllts.
I följande exempel visas widgeten Kryssruta för validering i olika lägen:
A. Widgetgrupp med kryssrutor för validering, läget minsta antal markeringar B. Widgeten Kryssruta för validering, obligatoriskt läge
Widgeten Kryssruta för validering innehåller ett antal lägen (t.ex. giltig, ogiltig, obligatoriskt värde, osv.). Du kan ändra egenskaperna för dessa lägen med egenskapskontrollen, beroende på önskat valideringsresultat. Widgeten Kryssruta för validering kan validera vid flera tillfällen, t.ex. när användaren klickar utanför widgeten, när användaren markerar eller försöker skicka formuläret.
Ursprungligt läge
Widgetläget när sidan läses in i webbläsaren eller när användaren återställer formuläret.
Läget Giltig
Widgetläget när användaren har gjort en markering eller rätt antal markeringar och formuläret kan skickas.
Läget Obligatorisk
Widgetläget när användaren inte har gjort en obligatorisk markering.
Läget Minsta antal markeringar
Widgetläget när användaren har markerat färre än det minsta antalet kryssrutor som krävs.
Läget Högsta antal markeringar
Widgetläget när användaren har markerat mer än det högsta antalet kryssrutor som är tillåtet.
När widgeten Kryssruta för validering anger ett av dessa lägen via åtgärder från användaren lägger logiken i Spry framework till en särskild CSS-klass till HTML-behållaren för widgeten i körläge. Om en användare t.ex. försöker skicka ett formulär men inte har gjort några markeringar lägger Spry till en klass i widgeten som gör att felmeddelandet ”Gör ett val” visas. Reglerna som styr formatet och visar felmeddelanden finns i CSS-filen som medföljer widgeten, SpryValidationCheckbox.css.
HTML-koden som är standard för widgeten Kryssruta för validering, som oftast finns i ett formulär, omfattar behållartaggen <span> som omger <input type="checkbox">-taggen i kryssrutan. HTML för widgeten Kryssruta för validering omfattar även skript-taggar i dokumenthuvudet och efter widgetens HTML-kod.
En mer utförlig förklaring om hur widgeten Kryssruta för validering fungerar samt en fullständig beskrivning av koden för widgeten finns på www.adobe.com/go/learn_dw_sprycheckbox_se.
Du kan också infoga en widget för kryssruta för validering genom att använda kategorin Spry på panelen Infoga.
Du kan ange tillfället då valideringen sker – när användaren klickar utanför widgeten, när användaren markerar eller när användaren försöker skicka formuläret.
OnBlur
Validerar när användaren klickar utanför kryssrutan.
OnChange
Validerar när användaren markerar.
OnSubmit
Validerar när användaren försöker skicka formuläret. Alternativet OnSubmit är markerat som standard och kan inte avmarkeras.
Widgeten Kryssruta för validering är inställd på obligatorisk som standard. Om du infogar ett antal kryssrutor på sidan kan du dock ange ett intervall med minsta och högsta antal markeringar. Om du t.ex. har sex kryssrutor i <span>-taggen för en enda widget för kryssruta för validering och vill se till att användaren markerar minst tre kryssrutor kan du göra en sådan inställning för hela widgeten.
Som standard visas felmeddelanden för widgeten Kryssruta för validering i rött med en kant på 1 pixel runt texten. Du kan ändra CSS för widgeten Kryssruta för validering så att du kan skapa en widget som är formaterad enligt dina önskemål. En mer avancerad lista över formateringsåtgärder finns på www.adobe.com/go/learn_dw_sprycheckbox_custom_se.
Dreamweaver sparar filen SpryValidationCheckbox.css i mappen SpryAssets på platsen när du skapar en widget för kryssruta för Spry-validering. Titta i denna fil eftersom den innehåller kommenterad information om olika typer av format som gäller för widgeten.
Text som ska formateras |
Relevant CSS-regel |
Relevanta egenskaper som ska ändras |
---|---|---|
Text i felmeddelande |
.checkboxRequiredState .checkboxRequiredMsg, .checkboxMinSelectionsState .checkboxMinSelectionsMsg, .checkboxMaxSelectionsState .checkboxMaxSelectionsMsg | color: #CC3333; border: 1px solid #CC3333; |
Trots att du enkelt kan redigera regler för widget för kryssruta för Spry-validering direkt i den tillhörande CSS-filen kan du även använda panelen CSS-format för att redigera CSS-formaten för widgeten. Panelen CSS-format är till nytta för att hitta CSS-klasserna som tilldelats olika delar av widgeten, i synnerhet om du använder läget Aktuell i panelen.
Logga in på ditt konto