Spry User Guide - Support - Adobe

Specify when validation occurs
By default, the Validation Checkbox widget validates when the user clicks the submit button. You can, however, set
two other options: blur or change. The validateOn:["blur"] parameter causes the widget to validate whenever
the user clicks outside the widget. The validateOn:["change"] parameter causes the widget to validate as the user
makes selections.
❖ To specify when validation occurs, add a validateOn parameter to the constructor as follows:
var sprycheckbox1 = new Spry.Widget.ValidationCheckbox("sprycheckbox1",
{validateOn:["blur"]});
As a convenience, you can discard the brackets if your validateOn parameter contains a single value (for example,
validateOn: "blur"). If the parameter contains both values, however (validateOn:["blur", "change"]),
include brackets in the syntax.
Specify a minimum and maximum number of selections
By default, a Validation Checkbox widget is set to required. If you insert a number of checkboxes on your page,
however, you can specify a minimum and maximum selection range. For example, if you have six checkboxes within
the span tagforasingleValidationCheckboxwidget,andyouwanttomakesurethattheuserselectsatleastthree
checkboxes, you can set such a requirement for the entire widget.
❖ To specify a minimum or maximum number of selections, add the minSelections property or maxSelections
property (or both) and a value to the constructor, as follows:
var checkboxwidget1 = new
Spry.Widget.ValidationCheckbox("checkboxwidget1",{minSelections:value,
maxSelections:value});
Change required status of checkboxes
By default, Validation Checkbox widgets require the user to make at least one selection before submitting the form.
You can, however, make selections optional for the user.
❖ To change the required status of a checkbox, add the isRequired property to the constructor and set its value to
false, as follows:
var checkboxwidget1 = new Spry.Widget.ValidationCheckbox("checkboxwidget1",
{isRequired:false});
Customize the Validation Checkbox widget
The SpryValidationCheckbox.css file provides the default styling for the Validation Checkbox widget. You can
customize the widget by changing the appropriate CSS rule. The CSS rules in the SpryValidationCheckbox.css file
use the same class names as the related elements in the widget’s HTML code, so it’s easy for you to know which CSS
rules correspond to the widget and its error states.
The SpryValidationCheckbox.css file should already be included in your website before you start customizing. For
more information, see “Prepare your files” on page 3.
SPRY
User Guide
89