Friday, August 9, 2013

ASP.Net MVC Html.ValidationMessageFor Static Layout

By default, the resulting field will not display if the validation is ok, and it'll appear when it's not. There might be a case where with such behavior, you end up with dynamically changing dimensions in your layout when editing the field under dynamic validation (jquery.validate.unobtrusive.js). The trick here is to make the hidden validation message occupy space. You can do this by adding this to your style sheet:

.field-validation-validspan.field-validation-error
{
 height: 13px;
 display: block;
}

You may change "display: block" to "display: inline-block" if you don't want the message to appear under the preceding element.

As of this writing, this is the only way I've been able to achieve this, as the ValidationMessageFor() method doesn't have any setting to play with. Suggestions are welcome!

1 comment:

Mihai C. said...

Great! Just what I was looking for!
Thanks a lot!