ASP.NET验证控件合集 含代码演示

简介: ASP.NET验证控件合集 含代码演示

文章目录


1. 窗体验证概述

2. ASP.NET中的数据验证控件

2.1. 空值验证 RequiredFieldValidator控件

2.2. 一致性验证 CompareValidator控件

2.3. 范围验证 RangeValidator控件

2.4. 正则验证 RegularExpressionValidator控件

2.5. 用户定义验证 CustomValidator控件

2.6. 验证错误汇总 ValidationSummany控件


正文


1. 窗体验证概述


为了提高WEB开发人员的开发效率,并降低错误出现的几率,ASP.NET中提供了多种多样的数据验证控件供开发人员使用。


在开发网站的时候,经常需要对用户提交的数据,比如说:验证用户填写的密码是不是符合指定的规则等等,这些都涉及到验证。在ASP.NET中,窗体验证主要分为客户端验证和服务器端验证,如图所示

1.png


2. ASP.NET中的数据验证控件


2.1. 空值验证 RequiredFieldValidator控件


RequiredFieldValidator验证控件用来验证输入文本中的信息内容是否为空

它有五个主要属性

属性 说明
ControlToValidate 表示要进行验证的控件,指定输入控件的ID。如果没有指定有效输入控件,则会在显示页面时引发异常。另外该ID的控件必须和验证控件在相同的容器中
ErrorMessage 当验证不通过时的提示信息
IsValid 设置所验证数据的有效性
Display 设置错误提示信息的显示方式
Text 如果Display为Static,并且不出错时,显示的文本

如下面代码,使用RequiredFieldValidator控件来验证用户是否输入用户名、密码和邮箱

...
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="Label1" runat="server" Text="用户名:"></asp:Label> 
            <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ErrorMessage="请输入用户名" ControlToValidate="TextBox1"></asp:RequiredFieldValidator>
        </div>
        <div>
            <asp:Label ID="Label2" runat="server" Text="密码:"></asp:Label> 
            <asp:TextBox ID="TextBox2" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator2" runat="server" ErrorMessage="请输入密码" ControlToValidate="TextBox2"></asp:RequiredFieldValidator>
        </div>
        <div>
            <asp:Label ID="Label3" runat="server" Text="邮箱:"></asp:Label> 
            <asp:TextBox ID="TextBox3" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RequiredFieldValidator ID="RequiredFieldValidator3" runat="server" ErrorMessage="请输入邮箱" ControlToValidate="TextBox3"></asp:RequiredFieldValidator>
        </div>
        <div>
            <asp:Button ID="Button1" runat="server" Text="注册" />
        </div>
    </form>
</body>
...

效果如图所示:

2.png


2.2. 一致性验证 CompareValidator控件


CompareValidator控件是一个比较验证控件,该控件可以将输入控件的值与常数值或其他输入控件的值相比较,以确定这两个值是否与比较运算符(小于、等于、大于等等)指定的关系相匹配;

另外,该控件还有数据类型检查的功能,如判断输入的是否为数字、日期等等。

它有九个主要属性

属性 说明
ControlToCompare 指定用于比较的输入控件的ID。默认是没有的
ValueToCompare 指定要比较的值,默认是没有的
ControlToValidate 指定要进行验证的控件ID,这个属性必须设置为输入控件ID,如果没有指定有效输入控件,那么在显示页面时引发异常。另外该ID的空间必须和验证控件在相同的容器中
ErrorMessage 当验证不通过时显示错误的信息
IsValid 设置所验证数据的有效性
Display 设置错误信息的显示方式
Text 如果Display为Static,并且不出错时,就显示该文本
Type 设置用于比较的两个值的数据类型。
有String、Integer、Double、Date、Currency五个枚举值,默认值为String
Operator 设置验证中使用的比较操作。
有Equal、NotEqual、GreaterThan、GreaterThanEqual、LessThan、LessThanEqual、DataTypeCheck七个枚举值,默认值为Equal

如下面代码,使用CompareValidator控件来验证用户两次输入的密码是否一致

...
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="Label1" runat="server" Text="用户名:"></asp:Label> 
            <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True"></asp:TextBox>
        </div>
        <div>
            <asp:Label ID="Label2" runat="server" Text="密码:"></asp:Label> 
            <asp:TextBox ID="TextBox2" runat="server" AutoPostBack="True"></asp:TextBox>
        </div>
        <div>
            <asp:Label ID="Label3" runat="server" Text="确认密码:"></asp:Label> 
            <asp:TextBox ID="TextBox3" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:CompareValidator ID="CompareValidator1" runat="server" ErrorMessage="两次输入的密码不一致" ControlToCompare="TextBox2" ControlToValidate="TextBox3"></asp:CompareValidator>
        </div>
        <div>
            <asp:Button ID="Button1" runat="server" Text="注册" />
        </div>
    </form>
</body>
...

效果如图所示:

3.png


2.3. 范围验证 RangeValidator控件


RangeValidator控件用于验证用户的输入是否在指定范围内。

它有八个主要属性:

属性 说明
ControlToValidate 指定要进行验证的控件ID,这个属性必须设置为输入控件ID,如果没有指定有效输入控件,那么在显示页面时引发异常。另外该ID的空间必须和验证控件在相同的容器中
ErrorMessage 当验证不通过时显示错误的信息
IsValid 设置所验证数据的有效性
Display 设置错误信息的显示方式
Text 如果Display为Static,并且不出错时,就显示该文本
Type 设置用于比较的两个值的数据类型。
有String、Integer、Double、Date、Currency五个枚举值,默认值为String
MaximumValue 设置要验证范围的最大值,待验证值必须<=MaximumValue ,默认值为空
MinimumValue 设置要验证范围的最小值,待验证值必须>=MinimumValue ,默认值为空

例如下面的代码设计了一个用户注册页面,在该页面中要求用户输入出生日期,出生日期要求限制在1990/1/1 ~2050/1/1之间,如果超过这个范围则显示提示信息。

...
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="Label4" runat="server" Text="出生日期:"></asp:Label> 
            <asp:TextBox ID="TextBox4" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RangeValidator ID="RangeValidator1" runat="server" ErrorMessage="格式不正确" ControlToValidate="TextBox4" MaximumValue="2050/1/1" MinimumValue="1900/1/1" Type="Date"></asp:RangeValidator>
        </div>
        <div>
            <asp:Button ID="Button1" runat="server" Text="注册" />
        </div>
    </form>
</body>
...

效果如图所示,上图是在范围内的日期,下图是超出范围的日期


4.png


2.4. 正则验证 RegularExpressionValidator控件


RegularExpressionValidator验证控件用来验证输入控件的值是否与某个正则表达式所定义的模式相匹配,如身份证号码、电子邮件地址、电话号码、邮政编码等。

它有六个主要属性

属性 说明
ControlToValidate 指定要进行验证的控件ID,这个属性必须设置为输入控件ID,如果没有指定有效输入控件,那么在显示页面时引发异常。另外该ID的空间必须和验证控件在相同的容器中
ErrorMessage 当验证不通过时显示错误的信息
IsValid 设置所验证数据的有效性
Display 设置错误信息的显示方式
Text 如果Display为Static,并且不出错时,就显示该文本
ValidationExpression 设置作为验证条件的正则表达式
该属性提供了一些常用的正则表达式,例如电子邮件格式、电话号码格式等等


例如下面的代码通过设置RegularExpressionValidator控件的ControlToValidate属性ValidationExpression属性验证用户输入的E-mail格式和用户名格式是否正确,用户名的输入自定义了一个正则表达式来限制用户名只能输入字母、下画线及数字。

...
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="Label1" runat="server" Text="用户名:"></asp:Label> 
            <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ErrorMessage="用户名只能是字母、下划线或者数字" ControlToValidate="TextBox1" ValidationExpression="\w+([-+.']\w+)*">
            </asp:RegularExpressionValidator>
        </div>
        <div>
            <asp:Label ID="Label4" runat="server" Text="电子邮件:"></asp:Label> 
            <asp:TextBox ID="TextBox4" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ErrorMessage="请输入正确的邮件格式" ControlToValidate="TextBox4" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">
            </asp:RegularExpressionValidator>
        </div>
        <div>
            <asp:Button ID="Button1" runat="server" Text="注册" />
        </div>
    </form>
</body>
...

效果如下面四幅图所示

5.png


2.5. 用户定义验证 CustomValidator控件


CustomValidator控件可以让用户自定义验证功能。例如,可以创建一个验证控件用于检查在文本框中输入的值是否为偶数。

它有七个主要属性

属性 说明
ControlToValidate 指定要进行验证的控件ID,这个属性必须设置为输入控件ID,如果没有指定有效输入控件,那么在显示页面时引发异常。另外该ID的空间必须和验证控件在相同的容器中
ErrorMessage 当验证不通过时显示错误的信息
IsValid 设置所验证数据的有效性
Display 设置错误信息的显示方式
ClientValidationFunction 设置用于验证的自定义函数的名称
EnableClientScript 设置是否启用客户端验证
Visible 设置该控件的可见性

例如下面的代码,实现了当用户输入的密码少于6位时,弹出对话框。

...
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script type="text/javascript">
        function myValidator() {
            var password = document.getElementById("TextBox2").value
            if (password.length < 6) {
                alert("密码不能少于六位");
            }
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="Label1" runat="server" Text="用户名:"></asp:Label> 
            <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True"></asp:TextBox>
        </div>
        <div>
            <asp:Label ID="Label2" runat="server" Text="密码:"></asp:Label> 
            <asp:TextBox ID="TextBox2" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:CustomValidator ID="CustomValidator1" runat="server" ErrorMessage="密码不能少于六位" ControlToValidate="TextBox2" ClientValidationFunction="myValidator">
            </asp:CustomValidator>
        </div>
        <div>
            <asp:Label ID="Label3" runat="server" Text="确认密码:"></asp:Label> 
            <asp:TextBox ID="TextBox3" runat="server" AutoPostBack="True"></asp:TextBox>
        </div>
        <div>
            <asp:Button ID="Button1" runat="server" Text="注册" />
        </div>
    </form>
</body>
...

效果如下图所示:

0000000000000000000000000000000.png


2.6. 验证错误汇总 ValidationSummany控件


ValidationSummary控件是错误汇总控件,主要用于收集本页中所有验证控件的错误信息,将它们组织好并一起显示出来,错误列表可以通过列表、项目符号列表或单个段落的形式进行显示。

它有六个主要属性

属性 说明
HeaderText 控件汇总信息
DisplayMode 设置错误信息的显示格式
ShowMessageBox 设置是否以弹出方式显示每个被验证控件的错误信息
ShowSummary 设置是否使用错误汇总信息
EnableClientScript 设置是否使用客户端验证
Validate 执行验证并且更新IsValid属性

例如下面的代码,集中了所有的报错信息,并弹出提示框

...
<body>
    <form id="form1" runat="server">
        <div>
            <asp:Label ID="Label1" runat="server" Text="用户名:"></asp:Label> 
            <asp:TextBox ID="TextBox1" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator1" runat="server" ErrorMessage="用户名只能是字母、下划线或者数字" ControlToValidate="TextBox1" ValidationExpression="\w+([-+.']\w+)*">
            </asp:RegularExpressionValidator>
        </div>
        <div>
            <asp:Label ID="Label4" runat="server" Text="出生日期:"></asp:Label> 
            <asp:TextBox ID="TextBox4" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RangeValidator ID="RangeValidator1" runat="server" ErrorMessage="格式不正确" ControlToValidate="TextBox4" MaximumValue="2050/1/1" MinimumValue="1900/1/1" Type="Date">
            </asp:RangeValidator>
        </div>
        <div>
            <asp:Label ID="Label2" runat="server" Text="电子邮件:"></asp:Label> 
            <asp:TextBox ID="TextBox2" runat="server" AutoPostBack="True"></asp:TextBox>
            <asp:RegularExpressionValidator ID="RegularExpressionValidator2" runat="server" ErrorMessage="请输入正确的邮件格式" ControlToValidate="TextBox4" ValidationExpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">
            </asp:RegularExpressionValidator>
        </div>
        <div>
            <asp:Button ID="Button1" runat="server" Text="注册" />
        </div>
        <div>
            <asp:ValidationSummary ID="ValidationSummary1" runat="server" ShowMessageBox="True" />
        </div>
    </form>
</body>
...

效果如图所示,点击注册按钮后,先显示上图的弹窗汇总,然后再显示下图的列表汇总

000000000000000000000000000000000000.png

相关文章
|
2月前
|
JSON IDE 前端开发
[.NET开发者的福音]一个方便易用的在线.NET代码编辑工具.NET Fiddle
[.NET开发者的福音]一个方便易用的在线.NET代码编辑工具.NET Fiddle
|
29天前
|
XML 开发框架 .NET
【.NET Core】常见C#代码约定
【.NET Core】常见C#代码约定
21 5
|
25天前
|
机器学习/深度学习 JSON 测试技术
CNN依旧能战:nnU-Net团队新研究揭示医学图像分割的验证误区,设定先进的验证标准与基线模型
在3D医学图像分割领域,尽管出现了多种新架构和方法,但大多未能超越2018年nnU-Net基准。研究发现,许多新方法的优越性未经严格验证,揭示了验证方法的不严谨性。作者通过系统基准测试评估了CNN、Transformer和Mamba等方法,强调了配置和硬件资源的重要性,并更新了nnU-Net基线以适应不同条件。论文呼吁加强科学验证,以确保真实性能提升。通过nnU-Net的变体和新方法的比较,显示经典CNN方法在某些情况下仍优于理论上的先进方法。研究提供了新的标准化基线模型,以促进更严谨的性能评估。
52 0
|
5天前
|
开发框架 JavaScript 前端开发
详细解读ASP常用三十三种代码
详细解读ASP常用三十三种代码
|
5天前
|
开发框架 JavaScript 前端开发
详细解读ASP常用三十三种代码
详细解读ASP常用三十三种代码
|
6天前
|
JSON 数据格式 微服务
.NET下 支持大小写不敏感的JSON Schema验证方法
有很多应用程序在验证JSON数据的时候用到了JSON Schema。 在微服务架构下,有时候各个微服务由于各种历史原因,它们所生成的数据对JSON Object属性名的大小写规则可能并不统一,它们需要消费的JSON数据的属性名可能需要大小写无关。 遗憾的是,目前的JSON Schema没有这方面的标准,标准中都是大小写敏感的。在类似上述情况下,这给使用JSON Schema进行数据验证造成了困难。
|
2月前
|
SQL 开发框架 JavaScript
分享33个ASP.NET电子商务源码和40个ASP.NET控件组件源码,总有一款适合您
分享33个ASP.NET电子商务源码和40个ASP.NET控件组件源码,总有一款适合您
49 0
|
2月前
|
SQL 开发框架 前端开发
ASP.NET WEB项目中GridView与Repeater数据绑定控件的用法
ASP.NET WEB项目中GridView与Repeater数据绑定控件的用法
49 0
|
2月前
|
JavaScript C#
【傻瓜级JS-DLL-WINCC-PLC交互】2.wincc使用C#开发的.net控件
【傻瓜级JS-DLL-WINCC-PLC交互】2.wincc使用C#开发的.net控件
56 0
|
2月前
|
JavaScript Linux C#
【傻瓜级JS-DLL-WINCC-PLC交互】1.C#用windows窗体控件创建.net控件
【傻瓜级JS-DLL-WINCC-PLC交互】1.C#用windows窗体控件创建.net控件
86 0