ASP.NET验证的一点改进

最近在使用ASP.NET提供的验证控件的时候想到一个问题

当设置Button的ValidationGroup属性后，只能触发这个Group的Validator的验证方法。

    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="TextBox1"
        runat="server" ErrorMessage="*" ValidationGroup="Group1"></asp:RequiredFieldValidator>

    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate="TextBox2"
        runat="server" ErrorMessage="*" ValidationGroup="Group2"></asp:RequiredFieldValidator>

    <asp:Button ID="btnGroup1" runat="server" Text="Group1" ValidationGroup="Group1" />
    <asp:Button ID="btnGroup2" runat="server" Text="Group2" ValidationGroup="Group2" />

可不可以有一个Button即触发Group1的验证事件又触发Group2的验证事件，ASP.NET又是怎么去判断Group的.

 

    <input type="submit" name="btnGroup1" value="Group1" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;btnGroup1&quot;, &quot;&quot;, true, &quot;Group1&quot;, &quot;&quot;, false, false))" id="btnGroup1" />
    <input type="submit" name="btnGroup2" value="Group2" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;btnGroup2&quot;, &quot;&quot;, true, &quot;Group2&quot;, &quot;&quot;, false, false))" id="btnGroup2" />

浏览页面查看源码可以看到Button的onclick属性，它调用了WebForm_DoPostBackWithOptions(options)方法，这个方法去调用验证事件，最后通过JS调试，找到片段Group的方法是
IsValidationGroupMatch

 

我们可以改写一下这个方法

 

    <script type="text/javascript">
        Array.prototype.contains = function(value) {
            var IsContains = false;
            for (var i = 0; i < this.length; i++) {
                if (this[i] == value) {
                    return true;
                }
            }
            return IsContains;
        }
        IsValidationGroupMatch = function(control, validationGroup) {
            if ((typeof (validationGroup) == "undefined") || (validationGroup == null)) {
                return true;
            }
            var controlGroup = "";
            if (typeof (control.validationGroup) == "string") {
                controlGroup = control.validationGroup;
            }
            if (controlGroup == validationGroup) {
                return true;
            }
            return (controlGroup.split('|').contains(validationGroup));
        }
    </script>

 

 这里用一个分隔符去把不同的Group分隔开来

 

 我们在页面上加个Button,并把RequiredFieldValidator1的ValidationGroup属性设为"Group1|Group2"

    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="TextBox1"
        runat="server" ErrorMessage="*" ValidationGroup="Group1|Group2"></asp:RequiredFieldValidator>
    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate="TextBox2"
        runat="server" ErrorMessage="*" ValidationGroup="Group2"></asp:RequiredFieldValidator>
    <asp:Button ID="btnGroup1" runat="server" Text="Group1" ValidationGroup="Group1" />
    <asp:Button ID="btnGroup2" runat="server" Text="Group2" ValidationGroup="Group2" />
    <asp:Button ID="btnAll" runat="server" Text="All"  ValidationGroup="Group1|Group2"/>

 运行页面发现btnAll,btnGroup2都触发了验证事件，但是btnGroup1确没有触发验证事件

 

    <input type="submit" name="btnGroup1" value="Group1" id="btnGroup1" />
    <input type="submit" name="btnGroup2" value="Group2" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;btnGroup2&quot;, &quot;&quot;, true, &quot;Group2&quot;, &quot;&quot;, false, false))" id="btnGroup2" />
    <input type="submit" name="btnAll" value="All" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;btnAll&quot;, &quot;&quot;, true, &quot;Group1|Group2&quot;, &quot;&quot;, false, false))" id="btnAll" />

查看源码发现btnGroup1没有注册WebForm_DoPostBackWithOptions(options)方法,可能是ASP.NET在呈现Button的时候会判断有没有符合这个Button的

ValidationGroup属性的Validator，如果有符合的Validator，ASP.NET才会为这个Button加上WebForm_DoPostBackWithOptions(options)方法，我用反射工具没有找到相关的呈现方法，所以只能手动加一个了。经测试btnGroup1成功触发验证事件。

完整代码如下

 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test.aspx.cs" Inherits="eComm.Maint.Web.Test"
    ValidateRequest="false" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator1" ControlToValidate="TextBox1"
        runat="server" ErrorMessage="*" ValidationGroup="Group1|Group2"></asp:RequiredFieldValidator>
    <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
    <asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate="TextBox2"
        runat="server" ErrorMessage="*" ValidationGroup="Group2"></asp:RequiredFieldValidator>
    <asp:Button ID="btnGroup1" runat="server" Text="Group1" OnClientClick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;btnGroup2&quot;, &quot;&quot;, true, &quot;Group1&quot;, &quot;&quot;, false, false))" ValidationGroup="Group1" />
    <asp:Button ID="btnGroup2" runat="server" Text="Group2" ValidationGroup="Group2" />
    <asp:Button ID="btnAll" runat="server" Text="All"  ValidationGroup="Group1|Group2"/>
    <script type="text/javascript">
        Array.prototype.contains = function(value) {
            var IsContains = false;
            for (var i = 0; i < this.length; i++) {
                if (this[i] == value) {
                    return true;
                }
            }
            return IsContains;
        }
        IsValidationGroupMatch = function(control, validationGroup) {
            if ((typeof (validationGroup) == "undefined") || (validationGroup == null)) {
                return true;
            }
            var controlGroup = "";
            if (typeof (control.validationGroup) == "string") {
                controlGroup = control.validationGroup;
            }
            if (controlGroup == validationGroup) {
                return true;
            }
            return (controlGroup.split('|').contains(validationGroup));
        }
    </script>
    </form>
</body>
</html>