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>

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

我错过了什么？开箱即用，我不需要编写适配器来获取必需或EmailAddress属性。我觉得我缺少一个设置或一段代码，我只是无法弄清楚是什么。

Answer 1

您用于查看的模型是TestViewModel

@model MyProject.Models.TestViewModel

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

TestViewModel

注意：客户端验证将在您使用public class TestViewModel { [Required] [EmailAddress] [Display(Name = "Email")] public string Email { get; set; } }创建的渲染视图中使用。因此，要启用客户端验证，您需要使用验证属性修饰其属性。这些验证与您用作TestViewModel操作输入的TestRequestModel无关。在模型绑定时将数据发布到服务器后，将在POST上设置属性。

Answer 2

您的代码在新项目中为我工作。我刚刚更改了 TestViewModel 模型。其他代码相同。您要发送给return view(model)查看的模型以及您在视图中使用的模型，即@model MyProject.Models.TestViewModel使客户端验证工作相同。

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

您可以像我一样更改 TestViewModel ，或者在您查看时使用 TestRequestModel 并将索引方法的return语句更改为 return View（new TestRequestModel（））;

如果不起作用，请直接在页面中拖动js文件并测试js（s）是否正在加载。

MVC5客户端验证没有开始

2 个答案: