MVC unobtrusive validation - model-view-controller

Question

I want to use unobtrusive validation on my MVC app.
I've created class
[AttributeUsage(AttributeTargets.Property, AllowMultiple = true, Inherited = true)]
public sealed class RequiredIfAttribute : ValidationAttribute, IClientValidatable
{
private const string _defaultErrorMessage = "{0} is required";
private string _targetPropertyName;
private bool _targetPropertyCondition;
public RequiredIfAttribute(string targetPropertyName, bool targetPropertyCondition)
: base(_defaultErrorMessage)
{
this._targetPropertyName = targetPropertyName;
this._targetPropertyCondition = targetPropertyCondition;
}
public override string FormatErrorMessage(string name)
{
return String.Format(CultureInfo.CurrentUICulture, ErrorMessageString, name, _targetPropertyName, _targetPropertyCondition);
}
protected override ValidationResult IsValid(object value, ValidationContext validationContext)
{
bool result = false;
bool propertyRequired = false;
var targetProperty = validationContext.ObjectType.GetProperty(_targetPropertyName);
var targetPropertyValue = (bool)targetProperty.GetValue(validationContext.ObjectInstance, null);
if (targetPropertyValue == _targetPropertyCondition)
{
propertyRequired = true;
}
if (propertyRequired)
{
if (value == null)
{
var message = FormatErrorMessage(validationContext.DisplayName);
return new ValidationResult(message);
}
}
return null;
}
public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
{
var rule = new ModelClientValidationRule();
rule.ErrorMessage = FormatErrorMessage(metadata.GetDisplayName());
rule.ValidationType = "requiredif";
rule.ValidationParameters.Add("targetpropertyname", this._targetPropertyName);
rule.ValidationParameters.Add("targetpropertyvalue", this._targetPropertyCondition.ToString().ToLower());
yield return rule;
}
}
I have validation function on client
$(function () {
$.validator.addMethod("requiredif", function (value, element, param) {
if ($(param.propertyname).is(':checked').toString() == param.propertyvalue) {
if (!this.depend(param, element))
return "dependency-mismatch";
switch (element.nodeName.toLowerCase()) {
case 'select':
var val = $(element).val();
return val && val.length > 0;
case 'input':
if (this.checkable(element))
return this.getLength(value, element) > 0;
default:
return $.trim(value).length > 0;
}
}
return true;
});
$.validator.unobtrusive.adapters.add("requiredif", ["targetpropertyname", "targetpropertyvalue"], function (options) {
if (options.element.tagName.toUpperCase() !== "INPUT" || options.element.type.toUpperCase() !== "CHECKBOX") {
options.rules["requiredif"] = {
propertyname: "#" + options.params.targetpropertyname,
propertyvalue: options.params.targetpropertyvalue
};
options.messages["requiredif"] = options.message;
}
});
} (jQuery));
But that does not validate. Why?

Answer 1

Check your web.config if you have there smth. like this
<appSettings>
<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />
of course you should use proper attributes in your model

Answer 2

Use valid js file.
https://cdnjs.cloudflare.com/ajax/libs/jquery-validation-unobtrusive/3.2.11/jquery.validate.unobtrusive.min.js
Can also be through the controller:
HtmlHelper.ClientValidationEnabled = true;
HtmlHelper.UnobtrusiveJavaScriptEnabled = true;