Spry Radio Validation Samples

This page gives examples of the Spry Radio Validation widget capabilities.

This is an example of a radio validation widget. There are three validation
techniques: validation can occur as you go (Change), when the text field loses
focus (Blur) or when the form is submitted (Submit). The Submit validation
occurs always, regardless of the other options chosen.

Change - Submit

Check me!Or me!Please make a selection.

Blur - Submit

Check me!Or me!Please make a selection.

Submit

Check me!Or me!Please make a selection.

The widget can be applied on a group of radios. You can have in your group of radios
an non-empty default value that you don't want to be submitted or define an invalid value.
This sample forces the user to select a radio different than the default 'None' value and the 'invalid'.

Categories:

None

INVALID

Sports

Health

Finance

Travel

Music

Technology

Publishing

Please make a selection.Please choose a valid value.

The error messages can be located in a different HTML element in page.

Change - Submit

Check me!Not me!Please make a selection.Please choose a valid value.

Errors

Please make a selection.Please choose a valid value.

This is an example showing how to style the error messages, using a css class similar to the one from the SpryValidationRadio.css file.

I decline
I acceptYou cannot submit the form until you accept the terms of the licence agreement!

You can change the widget container to use the radio label, and not to use any error messages.