2

我们正在使用 Fluent Validation 构建一个 ASP.NET MVC3 网站,并支持不显眼的验证。我们的 UX 团队询问我们是否可以支持两个单独的消息进行验证,每个字段和每个规则:一个显示在字段旁边,另一个显示在摘要中。

例如:

请解决以下问题:
- 请提供名字
- 请提供出生日期

名字:__________________ <名字是必需的>
出生日期:__________________ <出生日期是必需的>

请注意,字段级和摘要级验证消息是不同的。

我的第一个选择是扩展内置验证以允许第二条消息,但我认为这并不容易实现,因为所有内容都硬连接到仅支持一个 ErrorMessage的ModelError中。

所以我唯一能想到的另一件事就是通过将两条消息组合成一个字符串来破解它(是的,这个解决方案有味道),并修改助手/jquery以解析其中的两条消息(但我遇到了问题也这样做)。

该解决方案需要与客户端不显眼的验证(使用data-属性)以及服务器端一起使用。

我很想听听另一种方法来做到这一点。

更新

这是我的看法

@using (Html.BeginForm())
{
    @Html.ValidationSummary()
    <p>
        @Html.EditorFor(m => m.UserName)
        @Html.ValidationMessageFor(m => m.UserName)
    </p>
    <p>
        @Html.EditorFor(m => m.BirthDate)
        @Html.ValidationMessageFor(m => m.BirthDate)
    </p>    
    <input type="submit" />
}

这是它呈现的内容:

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <link href="/Content/Site.css" rel="stylesheet" type="text/css" />
    <script src="/Scripts/jquery-1.5.1.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.validate.js" type="text/javascript"></script>
    <script src="/Scripts/jquery.validate.unobtrusive.js" type="text/javascript"></script>
</head>
<body>
    <form action="/" method="post">
    <div class="validation-summary-valid" data-valmsg-summary="true">
        <ul>
            <li style="display: none"></li>
        </ul>
    </div>
    <p>
        <input class="text-box single-line" data-val="true" id="UserName" 
               name="UserName" type="text" value="" 
               data-val-required="The User name field is required." />
        <span class="field-validation-valid" 
              data-valmsg-for="UserName" data-valmsg-replace="true">
        </span>
    </p>
    <p>
        <input class="text-box single-line" data-val="true" id="BirthDate" 
               name="BirthDate" type="text" value="" 
               data-val-required="The Date of birth field is required." />
        <span class="field-validation-valid" data-valmsg-for="BirthDate" 
              data-valmsg-replace="true">
        </span>
    </p>
    <input type="submit" />
    </form>
</body>
</html>
4

0 回答 0