Recently, we here at delphic sage having been starting down the road to adopting jQuery as our client side framework of choice with regards AJAX and DHTML deliciousness. Part of this process included identifying which .NET controls we needed to replace with jQuery plugins. One of these that came up was the ASP.NET validators, which although highly effective and easy to use, offer a rather dated UI experience. I did a bunch of searching around and discovered these wonderful jQuery validators provided by bassisstance.de (Jörn Zaefferer has written many great jQuery plugins, check them out!).  These validators are just what we were looking for, but it didn't take long to discover that (A) they are not very .NET friendy because they rely on elements having a "name" attribute, and (B) they are not nearly as easy to implement as the asp.net validation controls from a developer perspective.

OK, So Let's Eat Our Cake, too

The jQuery validators look and behave greatly, but the asp.net validators are much easier to use. My mission here is to extend the asp.net validator controls to highlight and focus on invalid form fields in way that is comparable to what Jörn has done with his jQuery validators. The key advantage that I will try to attain is that I want the validators to be completely transparent to our developers when implementing in forms. They should continue to implement ASP.NET validation the same way they always have, and I should be able to upgrade the validators accross various legacy projects with very little effort. Because of this requirement, using inheritance to override the control behavior was out of the question since it would require developers to use new control tags and references for the new controls. Now that the goals have been defined, it's time to get hacky with some javascript.