asp.net-mvc - ASP.NET MVC AJAX 与 HTML.ValidationMessageFor

Question

我习惯了使用 UpdatePanels 执行 AJAX 的 ASP.NET Webforms 简单方法。我知道 MVC 的过程更加手工。

在特定情况下，我使用数据注释来验证某些表单输入。我使用 HTML.ValidationMessageFor 帮助程序来显示错误消息。如果我想使用 AJAX 发布此表单并显示此错误消息，流程是什么？是否可以保留 HTML.ValidationMessageFor 并使其与 AJAX 一起使用？

谢谢。

Answer 1

您是否使用内置 AJAX 方法？ 例如，您是否使用 Ajax.BeginForm(...) 创建 AJAX 表单？如果是这样，那么显示验证消息就很容易了。

还有一件事:您想要为每个不正确的控件显示验证消息，还是只想在表单上方显示验证摘要？我很确定您是在询问为每个控件显示一条单独的消息，但为了以防万一，我将同时包含这两个消息。

<小时/>

要为每个不正确的控件显示单独的消息:

首先，您需要将表单输入放入部分 View 中。我将其称为“部分 View ”RegisterForm.ascx。

接下来，您的 View 中应该会出现这样的内容:

<% using (Ajax.BeginForm("MyAction", null, 
    new AjaxOptions { 
        HttpMethod = "POST", 
        UpdateTargetId = "myForm" 
    }, 
    new { 
        id = "myForm" 
    })) { %>

     <% Html.RenderPartial("RegisterForm"); %>

<% } %>

最后，您的 Controller 操作应如下所示:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult MyAction(CustomViewModel m)
{
    if(!m.IsValid) //data validation failed
    {
        if (Request.IsAjaxRequest()) //was this request an AJAX request?
        {
            return PartialView("RegisterForm"); //if it was AJAX, we only return RegisterForm.ascx.
        }
        else
        {
            return View();
        }
    }
}

<小时/>

要仅在表单上方显示验证摘要:

您应该首先创建一个单独的 ValidationSummary 部分 View 。 ValidationSummary.ascx 的代码应如下所示:

<%@ Control Language="C#" Inherits="System.Web.Mvc.ViewUserControl" %>
<%= Html.ValidationSummary("Form submission was unsuccessful. Please correct the errors and try again.") %>

接下来，在您的 View 中，您应该看到如下内容:

<div id="validationSummary">
    <% Html.RenderPartial("ValidationSummary"); %>
</div>

<% using (Ajax.BeginForm("MyAction", new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "validationSummary" })) { %>
    <!-- code for form inputs goes here -->
<% } %>

最后，您的 Controller 操作应类似于以下内容:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult MyAction(CustomViewModel m)
{
    if(!m.IsValid) //data validation failed
    {
        if (Request.IsAjaxRequest()) //was this request an AJAX request?
        {
            return PartialView("ValidationSummary"); //if it was AJAX, we only return the validation errors.
        }
        else
        {
            return View();
        }
    }
}

<小时/>

希望有帮助!