具有客户端验证的自定义数据注释验证属性

Question

我制作了一个自定义数据注释属性，用于验证我的数据库中是否已经存在这样的电子邮件：

   public class ValidateEmail : ValidationAttribute
    {
        protected override ValidationResult IsValid(object value, ValidationContext validationContext)
        {
            using (var ctx = new myCtx())
            {
                if (value != null)
                {
                    var valueAsString = value.ToString().ToLower();
                    IEnumerable<string> email = ctx.Users.Where(x => x.Email != null).Select(x => x.Email);
                    if (email.Contains(valueAsString))
                    {
                        var errorMessage = FormatErrorMessage(validationContext.DisplayName);
                        return new ValidationResult(errorMessage);
                    }
                }
                return ValidationResult.Success;
            }
        }
    }

在我的视图模型中我是这样设置的：

   [ValidateEmail(ErrorMessage = "Email exists")]
        [Required(ErrorMessage = "Required")]
        [RegularExpression(@"^([\w\.\-]+)@([\w\-]+)((\.(\w){2,3})+)$", ErrorMessage = "Invalid Email")]
        public string Email { get; set; }

这在页面重新加载时完美运行...但我现在想更改它，以便我启用客户端验证和消息显示而无需重新加载页面本身...

如何修改此验证属性以使其符合 jquery 在 .NET MVC 中的不显眼验证？

基于@Sayan 的链接，我实现了这样的功能：

   public class ValidateEmail : ValidationAttribute, IClientValidatable
    {
        public IEnumerable<ModelClientValidationRule> GetClientValidationRules(ModelMetadata metadata, ControllerContext context)
        {
            var rule = new ModelClientValidationRule();
            rule.ErrorMessage = FormatErrorMessage(metadata.GetDisplayName());
            rule.ValidationType = "emailvalidate";

            yield return rule;

        }

        protected override ValidationResult IsValid(object value, ValidationContext validationContext)
        {
            using (var ctx = new myContext())
            {
                if (value != null)
                {
                    var valueAsString = value.ToString().ToLower();
                    IEnumerable<string> email = ctx.Users.Where(x => x.Email != null).Select(x => x.Email);
                    if (email.Contains(valueAsString))
                    {
                        var errorMessage = FormatErrorMessage(validationContext.DisplayName);
                        return new ValidationResult(errorMessage);
                    }
                }
                return ValidationResult.Success;
            }
        }
    }

和客户端：

$.validator.addMethod("emailvalidate", function (value, element) {
{
    console.log("value: " + value + " " + element);
}});
$.validator.unobtrusive.adapters.add("emailvalidate", function (options) {

      //adding rules for validator
    options.rules["emailvalidate"] = true;
    if (options.message) {
        options.messages["emailvalidate"] = options.message;
    }

});

但是我现在在电子邮件字段中插入的任何电子邮件都像：

myemail@ymail.xyz 

我收到电子邮件存在的错误？

Answer 1

您可以在ValidateEmail 验证属性中实现IClientValidatable，以向客户端提供data-val-xxx 属性。

然后，您可以编写 jQuery 不显眼的验证器和适配器，以使用 HTML 中呈现的 data-val-xxx 在客户端验证字段值。

请确保根据字段值是否有效分别从 jQuery 验证器返回 true（真值）或 false（假值）。

最后，将此自定义 jQuery 验证器脚本添加到您的视图中。

您可以找到更多详细信息here。虽然这篇博文呈现了一个稍微复杂的场景，但是看看如何使用IClientValidatable 以及如何编写 jQuery 不显眼的验证器就足够了。

希望这会有所帮助。