MVC5 客户端验证未启动

Question

所以我在 Stack Overflow 上解决了很多问题，并验证了我能想到的几乎所有内容，但我无法让客户端验证正常工作。我不知道我做错了什么。

为了缩短问题，删除了原始代码，下面提供了一个更简化的示例。

编辑：

我正在编辑此问题以尝试消除混淆并找到问题的根源。所以为了让这变得非常简单，我在我的项目中做了什么：

第 1 步：创建一个新的 TestController

public class TestController : Controller
{
    [HttpGet, AllowAnonymous]
    public ActionResult Index()
    {
        return View(new TestViewModel());
    }

    [HttpPost, AllowAnonymous, ValidateAntiForgeryToken]
    public ActionResult Index(TestRequestModel requestModel)
    {
        if (!@ModelState.IsValid)
        {
            return new TestViewModel
            {
                Email = requestModel.Email
            };
        }
        return View();
    }
}

第 2 步：创建了一个新的 TestView

@model MyProject.Models.TestViewModel
@{
    ViewBag.Title =  "User Console Home";
}

@using (Html.BeginForm("Index", "Test", FormMethod.Post, new {@class = "form-horizontal", role = "form"}))
{
    @Html.ValidationMessageFor(m => m.Email)
    @Html.LabelFor(m => m.Email)
    @Html.TextBoxFor(m => m.Email)
}

第 3 步：创建新的 TestRequestModel

public class TestRequestModel
{
    [Required]
    [EmailAddress]
    [Display(Name = "Email")]
    public string Email { get; set; }
}

第 4 步：创建新的 TestViewModel

public class TestViewModel
{
    public string Email { get; set; }
}

第 5 步：确保 Web.Config 包含正确的密钥

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

第 6 步：确保我的 _Layout.cshtml 包含正确的 javascript 文件

<!DOCTYPE html>
<html>
<head>
    <script src="/JQuery/jquery-2.2.3.js"></script>
    <script src="/JQuery/jquery-ui-1.11.4.js"></script>
    <script src="/JQuery/jquery.validate.js"></script>
    <script src="/JQuery/jquery.validate.unobtrusive.js"></script>
</head>
<body>
    @RenderBody()
</body>
</html>

将我的项目与具有客户端验证功能的全新项目进行比较，代码几乎相同

我错过了什么？开箱即用，我不需要编写适配器来获取 Required 或 EmailAddress 属性。我觉得我缺少一个设置或一段代码，我就是想不通是什么。

Answer 1

你的代码在一个新项目中为我工作。我刚刚更改了 TestViewModel model.Other 代码是 same.The 您发送给 return view(model) 查看的模型以及您在视图中使用的模型即 @model MyProject.Models.TestViewModel 应该与客户端验证相同。

public class TestViewModel
    {
        [Required]
        [EmailAddress]
        [Display(Name = "Email")]
        public string Email { get; set; }
    }

要么像我一样更改 TestViewModel，要么在视图中使用 TestRequestModel 并更改索引方法的 return 语句至 return 查看（新 TestRequestModel()）；

如果它不起作用，请将您的 js 文件直接拖到您的页面中并测试 jsis/are 加载与否。

Answer 2

您用于 View 的模型是 TestViewModel

@model MyProject.Models.TestViewModel

但是您没有使用验证属性装饰 TestViewModel 的 Email 属性，因此请将您的视图模型更改为：

public class TestViewModel
{
    [Required]
    [EmailAddress]
    [Display(Name = "Email")]
    public string Email { get; set; }
}

注意：客户端验证将用于您使用 TestViewModel 创建的渲染视图。因此，要启用客户端验证，您需要使用验证属性来装饰其属性。这些验证与您用作 POST 操作输入的 TestRequestModel 没有任何关系。您在 TestRequestModel 上设置的属性将在模型绑定时将数据发布到服务器后被命中。

MVC5 客户端验证未启动

MVC5 Client Side Validation not kicking in

c#

validation

asp.net-mvc

client-side-validation

asp.net-mvc-5