Operation Manual

432
USING DREAMWEAVER
Building Spry pages visually
Last updated 3/28/2012
Display widget states in Design view
1 Select a Validation Checkbox widget in the Document window.
2 In the Property inspector (Window > Properties), select the state you want to see from the Preview States pop-up
menu. For example, select Initial to see the widget in its initial state.
Customize Validation Checkbox widget error messages
By default, error messages for the Validation Checkbox widget appear in red with a 1-pixel border surrounding the
text. You can alter the CSS for the Validation Checkbox widget so that you can create a widget that is styled to your
liking. For a more advanced list of styling tasks, see
www.adobe.com/go/learn_dw_sprycheckbox_custom.
1 Open the SpryValidationCheckbox.css file.
Dreamweaver saves the SpryValidationCheckbox.css file in the SpryAssets folder of your site whenever you create a
Spry Validation Checkbox widget. It’s helpful to consult this file because it contains commented information about
various styles that apply to the widget.
2 Use the following table to locate the appropriate CSS rule, and then change the default properties, or add your own
text-styling properties and values:
Although you can easily edit rules for the Validation Checkbox widget directly in the accompanying CSS file, you can
also use the CSS Styles panel to edit the widget’s CSS. The CSS Styles panel is helpful for locating the CSS classes
assigned to different parts of the widget, especially if you use the panel’s Current mode.
More Help topics
“The CSS Styles panel in Current mode” on page 121
Working with the Spry Validation Password widget
About the Validation Password widget
The Spry Validation Password widget is a password text field that you can use to enforce password rules (for example,
number and type of characters). The widget provides warning or error messages based upon a user's input.
Note: You should be familiar with Spry validation widgets before you work with the Password widget. If you’re not
familiar with them, see
“Working with the Spry Validation Text Field widget” on page 419, or any of the other validation
widget overviews before proceeding. This overview does not present all basic validation widget concepts.
The following example shows a Validation Password widget in various states:
Text to style Relevant CSS rule Relevant properties to change
Error message text
.checkboxRequiredState .checkboxRequiredMsg,
.checkboxMinSelectionsState
.checkboxMinSelectionsMsg,
.checkboxMaxSelectionsState
.checkboxMaxSelectionsMsg
color: #CC3333; border: 1px solid #CC3333;