Ajax.BeginForm - 显示验证错误

Question

在VS2008中使用MVC项目模板(开箱即用)我注意到以下内容:

1. 以下是Register.aspx表单的指定方式.

   <% using (Html.BeginForm()) { %>
   

2. 选择"注册"按钮而不提供任何帐户信息会显示此信息 帐户创建失败.请更正错误,然后重试.

   •您必须指定用户名.
   •您必须指定电子邮件地址.
   •您必须指定6个或更多字符的密码.
   

3. 我将Register.aspx表单更改为此.

   <% using (Ajax.BeginForm("Register", new AjaxOptions { HttpMethod = "Post" })) { %>
   

4. 选择"注册"按钮而不提供帐户信息显示没有错误.

问题:如何在使用Ajax.BeginForm时显示错误文本？

Answer 1

要成功应用ajax表单提交,您必须修改Register操作和视图.默认情况下,如果出现错误,此操作只返回关联的register.aspx视图.第一步是将验证摘要放在部分用户控件中:

ValidationSummary.ascx:

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

然后在Register.aspx视图中包含此部分:

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

<% using (Ajax.BeginForm(new AjaxOptions { HttpMethod = "POST", UpdateTargetId = "validationSummary" })) { %>
    FORM CODE HERE
<% } %>

最后你修改了Register操作:

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Register(string userName, string email, string password, string confirmPassword)
{
    // ... skipped content for clarity

    // If we got this far, something failed, redisplay form
    if (Request.IsAjaxRequest())
    {
        // If an ajax request was made return only the validation errors 
        // instead of the whole page
        return PartialView("ValidationSummary");
    }
    else
    {
        return View();
    }
}

如果注册成功默认情况下,注册操作只会重定向到主页/索引.您还必须修改此位,因为在执行ajax请求时,重定向将不起作用.您可以测试是否异步调用操作并返回一些表明注册成功的文本.此文本将显示在与div验证错误相同的内容中.

更新:

最后一个问题 - 如何使用Html.ValidationMessage("....")方法将每个控件错误消息显示在控件旁边,而不是错误消息的项目符号列表？

为了实现这一点,您需要将表单的内容放在局部视图中:

<% using (Ajax.BeginForm(
    "register", 
    null, 
    new AjaxOptions { 
        HttpMethod = "POST", 
        UpdateTargetId = "myForm" 
    }, 
    new { 
        id = "myForm" 
    })) { %>
     <% Html.RenderPartial("RegisterForm"); %>
<% } %>

并在您的注册操作中呈现正确的部分:

if (Request.IsAjaxRequest())
{
    return PartialView("RegisterForm");
}
else
{
    return View();
}