首页前端开发HTMLASP.NET验证控件合集 含代码演示

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

时间2023-07-09 13:54:01发布访客分类HTML浏览876
导读：文章目录1. 窗体验证概述2. ASP.NET中的数据验证控件2.1. 空值验证 RequiredFieldValidator控件2.2. 一致性验证 CompareValidator控件2.3. 范围验证 RangeValidator控件...

文章目录

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中，窗体验证主要分为客户端验证和服务器端验证，如图所示


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.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>
    
...

效果如图所示：


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>
    
...

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



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>
    
...

效果如下面四幅图所示


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>
    
...

效果如下图所示：


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>
    
...

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

声明：本文内容由网友自发贡献，本站不承担相应法律责任。对本内容有异议或投诉，请联系2913721942#qq.com核实处理，我们将尽快回复您，谢谢合作！


若转载请注明出处： ASP.NET验证控件合集 含代码演示
本文地址： https://pptw.com/jishu/298655.html
Seata 的可观测实践 ASP.NET Core 中jwt授权认证的流程原理

游客 回复需填写必要信息
↑