jquery - ASP .Net MVC 3: Custom unobtrusive validation

Question

I am trying to add a custom unobtrusive validation to my app. It does not seem to run the validation.

Here is my Attribute class:

public IEnumerable<ModelClientValidationRule> GetClientValidationRules(
    ModelMetadata metadata, ControllerContext context)
{
    yield return new ModelClientValidationRule
    {
        ErrorMessage = ErrorMessage,
        ValidationType = "custrequired"
    };
}

And my JavaScript:

$.validator.addMethod('custrequired', function(value, element, param) {
  return value && value !== '99:99' && value !== '9:99';
});

$.validator.unobtrusive.adapters.add('custrequired', null, function(options) {
  return options.messages['custrequired'] = options.message;
});

Answer 1

There are plenty of things that can go wrong here, none involving the code you've posted:

• How does your generated HTML for the <input> look? Does it include the data-val-custrequired attribute?

• If not, did you remember to add the interface in the class declaration - IClientValidatable?

• Did you remember to not add your custom validator inside a DOM ready handler? (i.e. don't use $(document).ready() or $(function() { ... })) - the validation should be set up before the document is ready.

ETA: The reason for the last one is that jquery.validate.unobtrusive does this:

$(function () {
    $jQval.unobtrusive.parse(document);
});

I.e., it parses the document for validation attributes, rules etc. on document ready. Since that script has to be loaded in order to register your adapters, your registration script would normally have to come after jquery.validate.unobtrusive.js. But that also makes any .ready handler you register be called after the "unobtrusive" one - by which point it's too late. I guess you could put your registration script before and then use .ready. Never tried it, and I've never seen it done.

Also, in this case, this should be enough to register the adapter:

$.validator.addMethod('custrequired', function(value, element, param) {
   return value && value !== '99:99' && value !== '9:99';
});

jQuery.validator.unobtrusive.adapters.addBool('custrequired');

It will still add any custom error message you may have, but since your validator isn't using additional parameters (like e.g. StringLength passes MaximumLength etc.), there's no need for a custom adapter.