Frustrated by Magento? Then you’ll love Commerce Bug, the must have debugging extension for anyone using Magento. Whether you’re just starting out or you’re a seasoned pro, Commerce Bug will save you and your team hours everyday. Grab a copy and start working with Magento instead of against it.

Updated for Magento 2! No Frills Magento Layout is the only Magento
front end book you'll ever need. Get your copy
today!

And that’s it. The object initialized by VarienForm will automatically hook into your onSubmit, and if your field value fails the validation function, the PrototypeJS animated errors will take over.

Two last things. You can have multiple rules

class="validate-cant-be-bar validate-cant-be-bar"

and can find a butt load of pre added validators in

js/prototype/validation.js

Just search for Validation.addAllThese.

Update: One thing that might trip you up, and is a perfect example of Magento at its worst, is this validation has a different implementation in the frontend application vs. the adminhtml application. In the backend you need to say

var theForm = new varienForm('theForm', true);

That is, it’s varienForm with a lowercase v. That’s because each Magento area has its own implementation of the form class