验证客户端的MVC字段

Question

我在客户端验证一个字段时遇到问题，这是我的代码：

模型：

 public class Registration
    {
        public int Id { get; set; }
        [IsUserExistAttribute(ErrorMessage = "Email already exists!")]
        [EmailAddress(ErrorMessage = "Please enter valid Email")]
        [Required(ErrorMessage = "Email is required")]
        public string Email
        {
            get; set;

        }
        [MustBeTrue(ErrorMessage = "Please Accept the Terms & Conditions")]
        public bool TermsAndConditions { get; set; }


    }

ValidationAttribute：

public class IsUserExistAttribute : ValidationAttribute,IClientValidatable
    {
        public override bool IsValid(object email)
        {
            DemoDbContext demoContext=new DemoDbContext();
            string emailString = Convert.ToString(email);
            if (demoContext.Registrations.Any(a=>a.Email.Contains(emailString)))
            {
                return false;
            }
            return true;
        }

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

视图：

@using (Html.BeginForm())
{
    @Html.AntiForgeryToken()

    <div class="form-horizontal">
        <h4>Registration</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group">
            @Html.LabelFor(model => model.Email, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                @Html.EditorFor(model => model.Email, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.Email, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.TermsAndConditions, htmlAttributes: new { @class = "control-label col-md-2" })
            <div class="col-md-10">
                <div class="checkbox">
                    @Html.EditorFor(model => model.TermsAndConditions)
                    @Html.ValidationMessageFor(model => model.TermsAndConditions, "", new { @class = "text-danger" })
                </div>
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-2 col-md-10">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>
}

转向此工作正常，但我的问题是这个IsUserExistAttribute不在客户端验证它，在服务器端它验证并给出像电子邮件已经存在的消息！

但是，我希望它也能验证客户端。 那么，实现这一目标的好方法是什么？ 其他方法也欢迎:)

我尝试过这样的事情似乎没有成功：

 $.validator.addMethod("emailvalidate", function (value, element) {
            var is_valid = false;
            $.ajax({
                // as before...
                async: false,
                success: function (data) {
                    is_valid = data === 'True';
                }
            });
            return is_valid;
        }, "Username not available.");

Answer 1

MVC已经附带了一个用于客户端验证的RemoteAttribute （请参阅如何：在ASP.NET MVC中实现远程验证 ），因此您尝试重新发明轮子没什么意义。 （作为旁注，您当前缺少添加客户端验证规则所需的$.validator.unobtrusive.adapters.add()方法）。

但是您当前的验证属性存在一些问题。 验证属性不应该访问数据库，并且您无法对代码进行单元测试。 并且您将在ajax函数调用的控制器方法中再次重复属性中的代码，违反DRY主体并使维护代码变得更加困难。

相反，例如，为您的数据库代码在控制器（或单独服务中的公共方法）中创建一个私有方法

private bool IsEmailUnique(string email)
{
    return !db.Registrations.Any(a => a.Email.Contains(email)))
}

然后，对于客户端验证，使用RemoteAttribute装饰您的属性

[Remote("IsEmailValid", "ControllerName", ErorMessage = "...")]
public string Email { get; set; }

并添加控制器方法

public JsonResult IsEmailValid(string email)
{
    bool isValid = IsEmailUnique(email);
    return Json(isValid, JsonRequestBehavior.AllowGet);
}

然后，如果您还希望在提交表单时进行服务器端验证，请调用相同的方法，如果无效，则添加ModelStateError

public ActionResult Register(Registration model)
{
    bool isValid = IsEmailUnique(model.Email);
    if (!isValid)
    {
        ModelState.AddModelError("Email", "...");
    }
    if (!ModelState.IsValid)
    {
        return View(model);
    }
    // save and redirect
}