asp.net-mvc 如何在验证摘要中显示 MVC 3 客户端验证结果
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5150476/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to display MVC 3 client side validation results in validation summary
提问by b3n
I have a registration form on which I use client side validation (Required, StringLength etc. specified on my view model). The form is currently pretty much how the scaffolder creates it:
我有一个注册表单，我在上面使用客户端验证（在我的视图模型上指定的必需、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>
}
The only difference is that I moved the ValidationMessageFor to the top right beneath the ValidationSummary.
唯一的区别是我将 ValidationMessageFor 移到了 ValidationSummary 下方的右上角。
What I would like to do is display the client side validation errors in the validation summary. Currently they are just displayed on top of the form but not using the validation summary. How can I display client side validation errors using the validation summary? Is this even possible?
我想做的是在验证摘要中显示客户端验证错误。目前，它们仅显示在表单顶部，但不使用验证摘要。如何使用验证摘要显示客户端验证错误？这甚至可能吗？
Update
更新
Darin I have used your code in a new project and this is what it looks like for me when the client side validation kicks in:
Darin 我在一个新项目中使用了你的代码，这就是客户端验证开始时的样子：
Client side validation http://tinypic.com/images/404.gif
客户端验证 http://tinypic.com/images/404.gif
I expected this to be shown IN the validation summary with the validation summary styles applied. I also submitted the form which then look like this:
我希望这会显示在验证摘要中，并应用验证摘要样式。我还提交了表格，然后看起来像这样：
Thanks,
谢谢，
b3n
b3n
回答by orcy
This article seems to explain how add client side validation summary into the validation summary:
这篇文章似乎解释了如何将客户端验证摘要添加到验证摘要中：
However I did not test it by myself and it does not seem to have any difference with your code. If it does not work a good point to look might be jquery.validate.unobtrusive.js file on a function that actually places validation errors:
但是我没有亲自测试它，它似乎与您的代码没有任何区别。如果它不起作用，最好查看一个实际放置验证错误的函数上的 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);
});
}
}
回答by AzizKapProg
I resolved the issue in my project.
我在我的项目中解决了这个问题。
- add below key in configuration file
- 在配置文件中添加以下键
<add key="ClientValidationEnabled" value="true"/>
<add key="ClientValidationEnabled" value="true"/>
Add below code in html page where you want to display validation summary
@Html.ValidationSummary(false)Remove all @Html.ValidationFor lines from the view.
在要显示验证摘要的 html 页面中添加以下代码
@Html.ValidationSummary(false)从视图中删除所有 @Html.ValidationFor 行。
回答by Darin Dimitrov
From what I can see in your sample code you have two Html.ValidationSummaryinside the form. The first one takes trueas argument meaning that it excludes all property errors. The second one takes falseand works for both client side and server side validation errors. Example:
从我在您的示例代码中可以看到，Html.ValidationSummary表单中有两个。第一个true作为参数意味着它排除了所有属性错误。第二个false适用于客户端和服务器端验证错误。例子：
Model:
模型：
public class MyViewModel
{
[Required]
[StringLength(5)]
public string Username { get; set; }
[Required]
public string Name { get; set; }
}
Controller:
控制器：
public class HomeController : Controller
{
public ActionResult Index()
{
return View(new MyViewModel());
}
[HttpPost]
public ActionResult Index(MyViewModel model)
{
return View(model);
}
}
View:
看法：
@model AppName.Models.MyViewModel
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>
@using (Html.BeginForm())
{
@Html.ValidationSummary(false, "Please correct these errors:")
@Html.ValidationMessageFor(model => model.Username)
@Html.ValidationMessageFor(model => model.Name)
@Html.LabelFor(model => model.Username)
@Html.EditorFor(model => model.Username)
@Html.LabelFor(model => model.Name)
@Html.EditorFor(model => model.Name)
<input type="submit" value="Register" />
}
回答by Merlin47
i have solved this problem after 2 day of intense research, and finaly, i found the answer by myself and my experimentations !
经过两天的深入研究，我已经解决了这个问题，最后，我自己和我的实验找到了答案！
To display the Client-side Validator message in the validator Summary there is 3 easy step :
要在验证器摘要中显示客户端验证器消息，有 3 个简单的步骤：
1- put <add key="ClientValidationEnabled" value="false" />in the <appSettings>section of your web.config
1 -把<add key="ClientValidationEnabled" value="false" />在<appSettings>你的web.config的节
2- add your validation the "false" attribut in your view : @Html.ValidationSummary(false)
2- 在您的视图中添加您的验证“false”属性： @Html.ValidationSummary(false)
3- Remove all ValidationMessageFor(x => x.Property)in your view.
3-ValidationMessageFor(x => x.Property)在您的视图中删除所有内容。
when you,ll click in your submit button, the client-side Validation message will be displayed in your validation summary.
当您单击提交按钮时，客户端验证消息将显示在您的验证摘要中。
Enjoy!
享受！
回答by Martin Booth
The validation error messages are normally shown as part of the validation summary by default. The ValidationFor should normally go along side the control which causes the validation error in order to make it clear which control needs to be updated
默认情况下，验证错误消息通常显示为验证摘要的一部分。ValidationFor 通常应该与导致验证错误的控件一起使用，以便明确需要更新哪个控件
回答by Logan the guide
I had this same issue. I fixed it by making sure the following scripts were included in my page:
我有同样的问题。我通过确保我的页面中包含以下脚本来修复它：
@Scripts.Render("~/bundles/jqueryval")
@Scripts.Render("~/bundles/jquery")
I hope it does the trick for you, too.
我希望它也对你有用。
