客户端自定义不显眼验证不起作用

时间:2013-07-05 11:04:29

标签: c# jquery asp.net-mvc unobtrusive-validation

使用MVC4,我创建了一个实现IClientValidatable接口的自定义验证属性,如下所示:

public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        ModelClientValidationRule rule = new ModelClientValidationRule();
        rule.ErrorMessage = ErrorMessages.ClientFieldInputValidation;
        rule.ValidationType = "regularexpression";
        rule.ValidationParameters.Add("pattern", _regEx);
        yield return rule;
    }

我还实现了'regularexpression'客户端脚本,如下所示:

(function($) {
    $.validator.addMethod('regularexpression', function(value, element, params) {
        var regEx = RegExp(params['pattern']);
        return regEx.test($(element).val());
    });

    $.validator.unobtrusive.adapters.addBool('regularexpression');

})(jQuery)

我遇到的问题是正则表达式未在JavaScript的第3行中被选中:var regEx = RegExp(params['pattern']);。因此,客户端验证无法正常工作。服务器端验证工作正常,因为当我点击提交时,它会返回正确的反馈。

注意:我也尝试过对正则表达式进行硬编码以代替params['pattern'],并且工作正常。

任何人都可以帮我解决这个问题,因为我对 JavaScript 的了解不是你所谓的强大。

2 个答案:

答案 0 :(得分:7)

如果要对一个数据对象应用多个正则表达式验证以及客户端验证, 您不能将“ValidationType”名称用作“regex”。 您需要以某种方式使用自己的自定义唯一ValidationType。 你的javascript部分的问题是你正在使用错误的注入方法为你的正则表达式验证方法。

$.validator.unobtrusive.adapters.addBool('regularexpression');

您需要使用以下方法而不是上面的方法才能将服务器端模式值传递到客户端方法

$.validator.unobtrusive.adapters.addSingleVal("regularexpression", "pattern");

这是我的示例来源......

在服务器端,创建每个自定义验证属性。

public class OneDigitAttribute : RegularExpressionAttribute, IClientValidatable
{
    public OneDigitAttribute()
        : base(@"^.*(?=.*\d).+$")
    {
        ErrorMessage = "Required at least one numeric digit";
    }

    // for supporting a client-side validation through jquery.validation.unobtrusive
    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        yield return new ModelClientValidationRegexRule(this.ErrorMessage, this.Pattern)
        {
            ValidationType = "onedigit"
        };
    }
}

public class OneAlphaAttribute : RegularExpressionAttribute, IClientValidatable
{
    public OneAlphaAttribute()
        : base(@"^.*(?=.*[a-zA-Z]).+$")
    {
        ErrorMessage = "Required at least one alphabet character";
    }

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        yield return new ModelClientValidationRegexRule(this.ErrorMessage, this.Pattern)
        {
            ValidationType = "onealpha"
        };
    }
}

public class OneSpecialCharacterAttribute : RegularExpressionAttribute, IClientValidatable
{
    public OneSpecialCharacterAttribute()
        : base(@"^.*(?=.*[^a-zA-Z0-9]).+$")
    {
        ErrorMessage = "Required at least one non alphabet numeric(special) character";
    }

    public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
    {
        yield return new ModelClientValidationRegexRule(this.ErrorMessage, this.Pattern)
        {
            ValidationType = "onespecial"
        };
    }
}

并将它们应用于同一属性

[OneDigit]
[OneAlpha]
[OneSpecialCharacter]
[DataType(DataType.Password)]
public string NewPassword { get; set; } 
...

然后,在客户端添加每个唯一的验证方法,如下所示

$.validator.addMethod("onedigit", function (value, element, regexp) {
    var re = new RegExp(regexp); return re.test(value);
});

$.validator.addMethod("onealpha", function (value, element, regexp) {
    var re = new RegExp(regexp); return re.test(value);
});
$.validator.addMethod("onespecial", function (value, element, regexp) {
    var re = new RegExp(regexp); return re.test(value);
});
jQuery.validator.unobtrusive.adapters.addSingleVal("onedigit", "pattern");
jQuery.validator.unobtrusive.adapters.addSingleVal('onealpha', "pattern");
jQuery.validator.unobtrusive.adapters.addSingleVal('onespecial', "pattern");

请确保不要将它们全部放在DOM就绪函数中。 例如:

/* $(function() { */
$.validator.addMethod("regularexpression", function (value, element, regexp) {
    var re = new RegExp(regexp); return re.test(value);
});
$.validator.unobtrusive.adapters.addSingleVal("regularexpression", "pattern");
/* }); */

答案 1 :(得分:0)

尝试更改验证类型,使其与内置的RegEx验证程序匹配。当生成html时,现有的RegEx逻辑会触发,因此您不需要编写任何javascript。

public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
{
    ModelClientValidationRule rule = new ModelClientValidationRule();
    rule.ErrorMessage = ErrorMessages.ClientFieldInputValidation;
    rule.ValidationType = "regex";
    rule.ValidationParameters.Add("pattern", _regEx);
    yield return rule;
}