Asp.Net MVC - Change error class name

Question

When I do field validation in Asp.Net MVC, it's generated the following error css classes :

• input-validation-error
• field-validation-error

Is there a way that I can change the names of the error classes that are generated?

I use xVal.

Answer 1

I don't know about xVal but as far as the ASP.NET MVC side of things go, if you have a look at the source you'll see there are some static readonly strings that represent these values.

public static readonly string ValidationInputCssClassName = "input-validation-error";
public static readonly string ValidationMessageCssClassName = "field-validation-error";
public static readonly string ValidationSummaryCssClassName = "validation-summary-errors";

So either you edit the source to your liking (which may also fix xVal) or alter the outputting code to use different values somehow.

If xVal is using jQuery Validation (which I think it does...?) you could change it's default value for the 'errorClass' option. My answer here could help you along that path.

HTHs,
Charles

Answer 2

Here's what I did:

private void ChangeValidationClassNames()
{
    var helper = new HtmlHelper(new ViewContext(), new ViewPage());
    SetPublicStaticReadonly("ValidationInputCssClassName", helper, "errInput");
    SetPublicStaticReadonly("ValidationMessageCssClassName", helper, "errMsg");
}

public void SetPublicStaticReadonly(string readonlyPropName, object instance, object value)
{            
    var field = instance.GetType().GetField(readonlyPropName, BindingFlags.Static | BindingFlags.Public);
    if (field == null)
        throw new NullReferenceException(string.Format("public static readonly field '{0}' not found in '{1}'", readonlyPropName, instance));
    field.SetValue(instance, value);
}

Answer 3

More cleaner solution may be:

<script type="text/javascript">
    $(document).ready(function(){
        $('.input-validation-error').addClass('CustomErrorClass').removeClass('input-validation-error');
        $('.field-validation-error').addClass('CustomErrorClass').removeClass('field-validation-error');
    });
</script>