在 ASP.NET MVC 中使用 Remote validation without form on View

Question

我在 ASP.NET MVC 4 应用程序的 ViewModel 上使用了 Remote 属性。这是我的简单模型：

public class User
{
    [Required(AllowEmptyStrings = false, ErrorMessage = "test test")]
    public int Id { get; set; }

    [DisplayName("Email")]
    [Remote("RemoteValidateEmailLengthValidation", "Home")]

    public string Email { get; set; }
}

和远程验证方法：

public JsonResult RemoteValidateEmailLengthValidation(string Email)
{
    if (Email.Length > 20)
    {
        return Json("Too long email", JsonRequestBehavior.AllowGet);
    }
    else
    {
        return Json(true, JsonRequestBehavior.AllowGet);
    }
}

我在 Layout:

添加了验证所需的所有脚本

@Scripts.Render("~/bundles/jquery")
@Scripts.Render("~/bundles/jqueryui")
@Scripts.Render("~/bundles/jqueryval")

在WebConfig中写下我需要验证的所有内容：

<add key="ClientValidationEnabled" value="true" />
<add key="UnobtrusiveJavaScriptEnabled" value="true" />

并添加创建空模型的简单 Controller 和 return View.

@model ViewModels.User

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@using (Html.BeginForm("PostUser", "Home", FormMethod.Post))
{
    @Html.EditorForModel()
    <input type="submit" />
}

它只有在我将我的模型包裹在 form 中才有效，而 不起作用 如果我这样写我的 View:

@model ViewModels.User

@{
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@Html.EditorForModel()

所以我有问题：

为什么没有表单远程验证不起作用？因为在 Chrome 调试器中我看到表单没有提交我只看到验证方法调用。
远程验证使用了哪种javascript方法？ OnChange？我可以在任何地方看到它吗？我可以更改它吗？

Answer 1

客户端不引人注目的验证涉及

服务器端：所有用于生成表单控件的HtmlHelper 内部调用 GetUnobtrusiveValidationAttributes 方法 HtmlHelper 个。执行各种检查，如果不是全部满足条件（例如 UnobtrusiveValidation 已被禁用）然后是客户端验证所需的 data-val 属性未呈现
在客户端：当jquery.validation.unobtrusive.js是加载后，它首先检查 <form> 标签是否存在，然后基于 data-val 属性，添加规则、消息等 jquery.validate.

调用的第一个函数是

parse: function (selector) {
    var $forms = $(selector)
        .parents("form")
        .andSelf()
        .add($(selector).find("form"))
        .filter("form");
    ....

其中 selector 是 html 文档元素。如果没有 <form> 元素，则 var $forms 未定义，不再执行任何内容。如果没有 <form> 元素，客户端验证根本不起作用。

不清楚为什么要生成 html 不在表单中的表单控件，但您可以简单地自己调用控制器函数，return 一条消息并显示它

public JsonResult RemoteValidateEmailLengthValidation(string Email)
{
    if (Email.Length > 20)
    {
        return Json("Too long email", JsonRequestBehavior.AllowGet);
    }
    else
    {
        return Json(null, JsonRequestBehavior.AllowGet);
    }
}

和脚本

var url = '@Url.Action("RemoteValidateEmailLengthValidation", "Home")';
var placeHolder = $('[data-valmsg-for="Email"]');
$('#Email').change(function() {
  $.getJSON(url, { Email: $(this.val() }, function(response) {
    if(response) {
      placeHolder.text(response).removeClass('field-validation-valid').addClass('field-validation-error');
    }
  });
});

并处理 .keyup 事件以删除错误消息并重置 class 名称

Answer 2

在 aspnet 5 中找不到 JsonRequestBehavior

[HttpGet]
public JsonResult IsAllowedName(string FirstMidName)
{
    if (FirstMidName.ToLower() == "oleg")
    {

        //It seems that Microsoft.Asp.Net.Mvc does 
        //not contain JsonRequestBehavior enum
        return Json(false, JsonRequestBehavior.AllowGet); 
    }
    return Json(true);
}

终端输出

dnu build
/.../Controllers/ValidationController.cs(20,24):
DNXCore,Version=v5.0 error CS0103: 
The name 'JsonRequestBehavior' does not exist in the current context
Build failed.

在 ASP.NET MVC 中使用 Remote validation without form on View

Use Remote validation in ASP.NET MVC without form on View

ajax

asp.net-mvc

jquery

unobtrusive-validation