自定义validation摘要模板Asp.net MVC 3

我正在与Asp.Net MVC3的项目

在一个视图中我有@Html.ValidationSummary(true)和通常它产生的

 <div class="validation-summary-errors"> <ul> <li>Something bad Happened!</li> </ul> </div> 

我怎样才能将这个ValidationSummary扩展到MyValidationSummary,并生成如下所示的Html代码模板:

 <div class="notification warning"> <span></span> <div class="text"> <p>Something bad Happened!</p> </div> </div> 

这个问题详细介绍了编写自定义validation摘要的过程。

编辑这将做你想要的:

 public static class LinqExt { public static string MyValidationSummary(this HtmlHelper helper, string validationMessage="") { string retVal = ""; if (helper.ViewData.ModelState.IsValid) return ""; retVal += "<div class='notification-warnings'><span>"; if (!String.IsNullOrEmpty(validationMessage)) retVal += helper.Encode(validationMessage); retVal += "</span>"; retVal += "<div class='text'>"; foreach (var key in helper.ViewData.ModelState.Keys) { foreach(var err in helper.ViewData.ModelState[key].Errors) retVal += "<p>" + helper.Encode(err.ErrorMessage) + "</p>"; } retVal += "</div></div>"; return retVal.ToString(); } } 

代码是自我解释的; 只是通过模型状态错误枚举和包装在您select的DOM元素的错误。 有一个错误是,如果我使用它像:

 <%:Html.MyValidationSummary()%> 

它将在页面上显示html标签而不是渲染它。

 <%=Html.MyValidationSummary()%> 

这工作正常。

我的方法是使用自定义ValidationSummary.cshtml

 @model ModelStateDictionary @if(!Model.IsValid) { <div class="validation-summary-errors"> <ul> @foreach (var modelError in Model.SelectMany(keyValuePair => keyValuePair.Value.Errors)) { <li>@modelError.ErrorMessage</li> } </ul> </div> } 

把这个局部视图放到共享文件夹中,并从你的代码中引用它:

 @Html.Partial("_ValidationSummary", ViewData.ModelState); 

这样你就可以完全控制你的html。

基于flos的回答 ,我将它与Microsoft的jQuery Unobtrusive Validation兼容,并添加了Bootstrap的3面板样式。 这是新的代码:

 @model ModelStateDictionary <div class="@(Html.ViewData.ModelState.IsValid ? "validation-summary-valid" : "validation-summary-errors") panel panel-danger" data-valmsg-summary="true"> <div class="panel-heading"> Please, correct the following errors: </div> <div class="panel-body"> <ul> @foreach(var modelError in Model.SelectMany(keyValuePair => keyValuePair.Value.Errors)) { <li>@modelError.ErrorMessage</li> } </ul> </div> </div> 

你可以在这里详细阅读:

使用Bootstrap 3面板创build自定义ASP.NET MVC @ Html.ValidationSummary

我还创build了一个示例ASP.NET MVC项目来显示此自定义ValidationSummary的行动。 在这里获取:

https://github.com/leniel/AspNetMvcCustomHtmlValidationSummary

只是在这里发布我的答案,因为它对我来说很好;)

我使用一个简单的扩展方法,它接受一个MvcHtmlString并将其解码为HTML:

  public static MvcHtmlString ToMvcHtmlString(this MvcHtmlString htmlString) { if (htmlString != null) { return new MvcHtmlString(HttpUtility.HtmlDecode(htmlString.ToString())); } return null; } 

为了解决这个问题,我将validation摘要助手添加到我的chstml中,如下所示:

 @Html.ValidationSummary(true).ToMvcHtmlString() 

这意味着,我可以添加自定义HTML到我的validation摘要:

 ModelState.AddModelError("", "<p>This message can have html in it</p>"); 

而且我甚至可以将自定义的HTML添加到我的字段validation消息中:

 ModelState.AddModelError("MyField", "<p>This message can have html in it</p>"); 

并让我的字段validation消息与HTML一起工作:

 @Html.ValidationMessageFor(model => model.MyField).ToMvcHtmlString(); 

添加相关的样式:

 .field-validation-error { color: #b94a48; } .field-validation-valid { display: none; } input.input-validation-error { border: 1px solid #b94a48; } input[type="checkbox"].input-validation-error { border: 0 none; } .validation-summary-errors { color: #b94a48; } .validation-summary-valid { display: none; } 

我只想显示顶级的消息,没有别的。 我们已经在下面的字段旁边进行validation。 closures@ Leniel-Macaferi的解决scheme,这是我做了什么,使其与jQueryvalidation工作:(添加样式=“显示:无;”)

 <div class="@(Html.ViewData.ModelState.IsValid ? "validation-summary-valid" : "validation-summary-errors")" data-valmsg-summary="true"> <div> There are still some fields not filled in before we can submit this. Please correct. </div> <div style="display: none;"> <ul> @foreach (var modelError in Model.SelectMany(keyValuePair => keyValuePair.Value.Errors)) { <li>@modelError.ErrorMessage</li> } </ul> </div> </div> 

我只需要做一些类似的服务器端validation(例如检查文件内容),并最终彻底篡改@ Html.ValidationSummary完全相当一个很好的小工作。

我们有一个扩展Controller的BaseController类,在这里面我们重写了OnActionExecuting方法。 我们在ViewBag中为我们的错误消息创build一个新的列表,并确保在任何操作运行之前,它被初始化。 然后我们可以添加我们的错误显示给它,并显示在屏幕上。

为了这个问题的目的,它看起来像这样。

 public class BaseController : Controller { protected override void OnActionExecuting(ActionExecutingContext filterContext) { if (ViewBag.ErrorsList == null) { ViewBag.ErrorsList = new List<string>(); } } } 

然后在我们的_Layout.cshtml的上面添加@RenderBody()

 @if(ViewBag.ErrorsList.Count > 0) { <div class="container margin-top-10 alert alert-danger"> <h3><i class="glyphicon glyphicon-warning-sign"></i></h3><br/> @foreach (string error in @ViewBag.ErrorsList) { @error <br/> } </div> @RenderBody() } 

现在,无论何时发生服务器端错误,我们只需将其添加到我们的ViewBag.ErrorsList

 ViewBag.ErrorsList.Add("Something bad happened..."); 

瞧,一个自定义容器为您的服务器端validation错误消息与您想要的任何样式,错误以与ValidationSummary相同的方式传递。