Asp.net mvc 如何在验证摘要中显示MVC 3客户端验证结果

我有一个使用客户端验证的注册表（视图模型上指定的必填项、StringLength等）。该表单目前基本上是架子工创建它的方式：

@using (Html.BeginForm("Index", "Registration"))
{
    @Html.ValidationSummary(true)
    <fieldset>
        <legend>Registration details</legend>
        @Html.ValidationSummary(false, "Please correct these errors:")
        @Html.ValidationMessageFor(model => model.Username)
        <div class="editor-label">
            @Html.LabelFor(model => model.Username)
        </div>
        <div class="editor-field">
            @Html.EditorFor(model => model.Username)
        </div>
        <p>
            <input type="submit" value="Register" />
        </p>
    </fieldset>
}

@使用（Html.BeginForm（“索引”、“注册”））
{
@Html.ValidationSummary（true）
注册详情
@ValidationSummary（false，“请更正这些错误：”）
@Html.ValidationMessageFor（model=>model.Username）
@LabelFor（model=>model.Username）
@EditorFor（model=>model.Username）


}

唯一的区别是我将ValidationMessageFor移动到ValidationSummary下方的右上角

我想做的是在验证摘要中显示客户端验证错误。目前，它们仅显示在表单顶部，但不使用验证摘要。如何使用验证摘要显示客户端验证错误？这可能吗

更新

Darin我在一个新项目中使用了您的代码，这就是客户端验证开始时我的感受：

我希望这会显示在应用了验证摘要样式的验证摘要中。我还提交了如下表格：

谢谢

---

b3n默认情况下，验证错误消息通常显示为验证摘要的一部分。ValidationFor通常应与导致验证错误的控件一起进行，以明确需要更新哪个控件。从示例代码中可以看到，表单中有两个

Html.ValidationSummary

。第一个参数采用

true

作为参数，这意味着它排除了所有属性错误。第二种方法为

false

，适用于客户端和服务器端验证错误。例如：

型号：

public class MyViewModel
{
    [Required]
    [StringLength(5)]
    public string Username { get; set; }

    [Required]
    public string Name { get; set; }
}

控制器：

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View(new MyViewModel());
    }

    [HttpPost]
    public ActionResult Index(MyViewModel model)
    {
        return View(model);
    }
}

视图：

@model AppName.Models.MyViewModel
@使用（Html.BeginForm（））
{
@ValidationSummary（false，“请更正这些错误：”）
@Html.ValidationMessageFor（model=>model.Username）
@Html.ValidationMessageFor（model=>model.Name）
@LabelFor（model=>model.Username）
@EditorFor（model=>model.Username）
@LabelFor（model=>model.Name）
@EditorFor（model=>model.Name）
}

本文似乎解释了如何将客户端验证摘要添加到验证摘要中：

然而，我并没有亲自测试它，它似乎与您的代码并没有任何区别。如果它不起作用，一个值得注意的地方可能是函数上的jquery.validate.unobtrusive.js文件，该文件实际上会导致验证错误：

function onErrors(form, validator) {  // 'this' is the form element
    var container = $(this).find("[data-valmsg-summary=true]"),
        list = container.find("ul");

    if (list && list.length && validator.errorList.length) {
        list.empty();
        container.addClass("validation-summary-errors")
          .removeClass("validation-summary-valid");

        $.each(validator.errorList, function () {
            $("<li />").html(this.message).appendTo(list);
        });
    }
}

函数onErrors（form，validator）{/'this'是form元素
var container=$（this.find（“[data valmsg summary=true]”），
列表=容器。查找（“ul”）；
if（list&&list.length&&validator.errorList.length）{
list.empty（）；
container.addClass（“验证摘要错误”）
.removeClass（“有效验证摘要”）；
$.each（validator.errorList，函数（）{
$（“
”）html（this.message）.appendTo（list）；
});
}
}

经过两天的紧张研究，我解决了这个问题，最后，我自己和我的实验找到了答案

要在验证程序摘要中显示客户端验证程序消息，有3个简单步骤：

1-将

放入web.config的

部分

2-将验证添加到视图中的“false”属性：

@Html.ValidationSummary（false）

3-删除视图中的所有

ValidationMessageFor（x=>x.Property）

当您单击“提交”按钮时，客户端验证消息将显示在验证摘要中

---

享受吧

我在项目中解决了这个问题

在配置文件中添加以下键

在要显示验证摘要的html页面中添加以下代码

@Html.ValidationSummary（false）

从视图中删除所有@Html.ValidationFor行

---

我也有同样的问题。我通过确保我的页面中包含以下脚本来修复它：

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

---

我希望它也能为您带来好处。

谢谢，服务器端验证错误在验证摘要中显示得很好。但是，与其在每个框旁边显示文本字段，我还希望在验证摘要中显示客户端错误。包含错误的控件仍然设置为红色背景，以便用户知道错误所指的控件。您好，Merlin47，这不是客户端验证。您正在服务器端验证数据。在客户端验证中，无法将数据提交到服务器。不幸的是，这是服务器端验证。

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