We have a standard that is part of our definition of done that includes adding client side validation to any page that contains a form. We always require server side validation, but I really like this standard since I’m all about progressive enhancement. We have adopted Jörn Zaefferer’s Validation plug-in (to which I have committed) as the de-facto plugin of choice. Our previous forms, while on MVC Beta, had the following HTML generated:
<input type="text" name="PostalCode" id="PostalCode" />
Since we have upgraded to MVC version 1.0, our HTML is now generated like this:
<input type="text" name="Address.PostalCode" id="Address.PostalCode" />
This introduced a problem, at least temporarily, for the validation plug-in. Whereas the property of the rules and messages was simply “PostalCode” before, it now must be “Address.PostalCode”, which causes a syntax error.
rules: { Address.PostalCode: { required: true; digits: true; length: 5; }}
The beauty of this excellent language is that there is probably a way to handle this. There is a super simple solution, which took me one trial and no errors to figure out:
rules: { 'Address.PostalCode': { required: true; digits: true; length: 5; }}
This was a good reminder to me that JavaScript isn’t bad, the DOM is and that you can do pretty much anything in JavaScript.
Also, you can find this buried in the documentation.
