26.3 验 证 控 件
用户在网页的控件上面输入数据,往往需要对其进行有效性验证,这样可以及时检查用户提交的数据是否合法,同时可以减少服务器的负担。
26.3.1 限制空字段控件RequiredFieldValidator
它用于限制空字段,在页面提交前不允许输入为空。在工具箱中的“验证”一栏中可以找到这个控件,如图26.28所示。下面将通过实例介绍该控件的用法,步骤如下。
(1)打开Visual Studio 2008,新建一个ASP.NET Web应用程序,并命名为ValidatorTest。
(2)将页面切换到“设计”视图,并添加一个具有4行3列的表。
(3)在表中拖放3个Label控件、3个TextBox控件和1个Button控件。为3个Label和Button控件添加Text属性,并布局界面,如图26.29所示。
图26.28 验证控件 图26.29 布局控件
(4)分别为3个TextBox控件设置ID属性。其中“用户名”对应为UserNameTxt;“密码”对应为PassWordTxt;“年龄”对应为AgeTxt。
(5)在“工具箱”中的“验证”栏找到RequiredFieldValidator控件,并拖放至用户名输入文本框对应的右边表格中。
(6)选定该控件,在其属性窗口中找到ErrorMessage,并将其设置为“*必需填写用户名”。同时,将ControlToValidate属性值设置为UserNameTxt。
这两个属性中,前者用于设置验证错误发生时要显示在控件上的信息。后者用于将当前控件与ID名为UserNameTxt的控件关联。
运行程序,测试RequiredFieldValidator控件的效果。如果“用户名”中不输入任何信息就单击“提交”按钮,该控件上会显示ErrorMessage里设置的信息,即“*必需填写用户名”,如图26.30所示。
图26.30 非空检查
%说明:RequiredFieldValidator控件还有一个比较重要的属性就是display,它有3个可能的取值,分别是None、Static和Dinamic。表26.1列出了它们的详细解释。
表26.1 display的属性值及其意义
属 性 值 | 意 义 |
Dinamic | 动态显示验证错误信息,其在页面上的位置空间只有在验证错误发生时才给出 |
None | 验证错误信息,但是不显示到页面上 |
Static | 与Dinamic不同,该属性使得不管验证错误是否发生,页面都会留出供显示错误信息的空间 |
由于属性值为Dinamic时,验证错误信息是动态给出的。因此,如果之前该空间被其他页面内容占据时,会导致这部分内容的显示位置发生变化,从而可能使页面布局并非预想的那样。所以在选择属性值的时候,应该在兼顾布局的基础上,充分利用空间,综合利用这3种取值的优势。
26.3.2 比较两个字段控件CompareValidator
可以使用CompareValiator与固定值比较,也可以对两个控件进行比较,也可以用于检查数据类型。
首先是CompareValiator与固定值的比较。为此还是利用前面介绍的例程说明该用法,设计步骤如下。
(1)打开网站ValidatorTest,将页面切换到“设计”视图,然后在年龄对应文本框的右边表格里添加两个验证控件。一个是RequiredFieldValidator控件,另一个是CompareValidator控件。前者用于验证输入非空,后者用于比较输入的年龄数字是否与给定的数字相符。
(2)设置RequiredFieldValidator控件的属性,如表26.2所示。
表26.2 设置RequiredFieldValidator的属性
属 性 | 属 性 值 | 属 性 | 属 性 值 |
ErrorMessage | *年龄不能为空 | Display | Dinamic |
然后设置CompareValidator控件的属性如表26.3所示。
表26.3 设置CompareValidator的属性
属 性 | 属 性 值 | 属 性 | 属 性 值 |
ErrorMessage | *年龄不能小于20岁 | ValueToCompare | 20 |
Display | Dinamic | Type | Integer |
Operator | GreaterThanEqual |
将两个控件的Display属性都设置为Dinamic,是为了显示验证错误时的布局紧凑和美观。CompareValidator的Operator设置为GreaterThanEqual表示大于等于,用于验证控件中的输入是否大于等于ValueToCompare属性给定的值。Type属性指定了要比较的值(此处是20)的数据类型,它还可以是String、Double、Date和Currency等类型。其中Date表示日期类型,Currency是货币类型。
(3)运行程序,测试上面对控件设置的效果,如图26.31所示。当输入的年龄小于20时则会显示验证信息,如图26.32所示。
图26.31 非空检查 图26.32 比较验证
可以看出两个验证控件所显示的位置都是一样的,这是Display的Dinamic属性值在起作用。当输入的年龄大于或等于20时,则可以通过验证。
接下来是使用CompareValidator控件对两个控件的输入进行比较。下面将对“用户名”和“密码”是否一致进行比较,设计步骤如下。
(1)打开网站ValidatorTest,将页面切换到“设计”视图。在“工具箱”中找到CompareValidator控件,并拖放至页面中“密码”对应的输入框右边的表格中。
(2)为CompareValidator控件设置属性,如表26.4所示。
表26.4 设置CompareValidator的属性
属 性 | 属 性 值 | 属 性 | 属 性 值 |
ErrorMessage | 密码和用户名不能相同 | ControlToCompare | UserNameTxt |
Display | Static | Type | String |
Operator | NotEqual | TextModel | Password |
ControlToValidate | PassWordTxt |
(3)上述设置就实现了两个输入控件内容的比较。Operator设置为NotEqual,表示两个控件内容不等时通过验证。ControlToValidate表示用于验证的控件,此处为PassWordTxt控件。ControlToCompare为UserNameTxt,表示用于比较的另外一个控件ID。TextModel表示输入的文本以密码形式显示。
(4)运行程序可以看到,当输入的用户名和密码不同时,验证通过。当输入的用户名和密码相同时,验证不能通过,并且显示验证的提示信息,如图26.33所示。
图26.33 验证两个控件的输入内容
最后是用户数据类型检查,其设计步骤如下:
(1)打开网站ValidatorTest,将页面切换到“设计”视图。
(2)在表中添加一行,为此鼠标选定表的最后行。右键单击该行,在弹出的快捷菜单中选择“插入”|“上面的行(A)”命令。
(3)在新添加的行中添加一个Label控件、一个TextBox控件和一个CompareValidator控件,并将Label控件的Text属性设置为“出生年月”。将CompareValidator控件的ID属性设置为AgeTxt。
(4)将CompareValidator控件的属性设置为如表26.5所示。
表26.5 设置CompareValidator的属性
属 性 | 属 性 值 | 属 性 | 属 性 值 |
ErrorMessage | 日期格式错误 | ControlToValidate | BirthdateTxt |
Display | Dynamic | Type | Date |
Operator | DataTypeCheck |
Operator的属性设置为DataTypeCheck,表示进行日期类型检查操作。Type设置为Date表示比较的值的数据类型为日期类型。
(5)运行程序,得到如图26.34所示效果。如果输入的日期超出实际表示范围,这时会发生日期格式错误信息提示,如图26.35所示。
图26.34 日期类型检查 图26.35 日期格式错误
26.3.3 检查指定范围控件RangeValidator
该控件用于检查用户输入数据的范围。这种数据可以是数字、字符串、日期等。用户可以通过RangeValidator控件的属性来指定数据的范围。下面将以前面介绍的例程为例,介绍RangeValidator控件的使用方法,设计步骤如下:
(1)打开网站ValidatorTest,将页面切换到“设计”视图。在“工具箱”中找到RangeValidator控件,并拖放至页面中“出生年月”对应的输入框右边的表格中(其中已经有一个CompareValidator控件)。
(2)设置RangeValidator控件的属性如表26.6所示。
表26.6 设置RangeValidator的属性
属 性 | 属 性 值 | 属 性 | 属 性 值 |
ErrorMessage | 出生日期超出指定范围 | MaximumValue | 2027-9-1 |
Display | Dynamic | MinimumValue | 1997-9-1 |
ControlToValidate | BirthdateTxt | Type | Date |
(3)其中MaximumValue和MinimumValue指定了控件中允许输入的范围。此处表示日期范围。
(4)运行程序可以看到,当输入的日期范围超出指定的日期范围时,范围验证控件会显示验证错误信息,如图26.36所示。
26.3.4 表达式验证控件RegularExpressionValidator
网页中的输入控件有时需要帮助用户对输入数据做简单的格式判断,如电子邮件地址、电话号码、身份证、邮政编码等。这些数据都有一个共同点,就是它们都具有一些相对固定的格式。如电子邮件地址中都有一个“@”符号,国内身份证号为15位或18位。ASP.NET提供了对应的表达式验证控件RegularExpressionValidator,用于验证这些输入是否符合预先定义好的格式。定义的这个格式就是正则表达式。
图26.36 范围验证控件
下面将以前面介绍的例程为基础,介绍表达式验证控件RegularExpressionValidator的用法,设计步骤如下:
(1)打开网站ValidatorTest,将页面切换到“设计”视图。在表中按照前面介绍的方法,添加一行到表格中,并在工具箱中拖放一个Label控件、一个TextBox控件和一个RegularExpressionValidator控件。
(2)将Label控件的Text属性设置为“电子邮件地址:”,将TextBox控件的ID属性设置为EmailTxt。
(3)设置RegularExpressionValidator控件属性,如表26.7所示。
表26.7 设置RangeValidator的属性
属 性 | 属 性 值 | 属 性 | 属 性 值 |
ErrorMessage | 电子邮件格式错误 | ControlToValidate | EmailTxt |
Display | Static | ValidationExpression | "w+([-+.']"w+)*@"w+([-.]"w+)*"."w+([-.]"w+)* |
其中的ValidationExpression是用于确定输入格式的正则表达式。读者如果不熟悉该表达式也不必担心,此处可以通过ValidationExpression属性提供的“正则表达式编辑器”来完成。为此,单击该属性项中提供的浏览按钮,得到如图26.37所示“正则表达式编辑器”对话框。
其中还提供了网络URL表达式、各国电话号码表达式、邮政编码、电话号码等常用的验证表达式。此处选择“Internet电子邮件地址”选项,然后单击“确定”按钮,便完成了电子邮件地址的正则表达式设置。
(4)运行程序,效果如图26.38所示。
26.3.5 自定义验证控件CustomValidator
自定义验证控件用于解决在数据验证时,验证方式的个性需求。前面介绍的几个控件都属于客户端验证控件,也只能用于客户端验证。而自定义控件CustomValidator,则可以实现服务器端的数据验证,如数据库中的数据对比等。
图26.37 “正则表达式编辑器”对话框 图26.38 表达式验证控件
下面将介绍如何使用CustomValidator控件,验证用户所提交的用户名在服务器端数据库中是否已经存在。为此首先需要建立一张用于存储用户名的表,设计步骤如下。
(1)打开数据库在前面章节中建立的ASPDataBase数据库,在其中建立一个用于存储用户名的表UserName,并添加列名及其数据类型,如图26.39所示。
(2)在表中添加一条记录aaa,如图26.40所示。
图26.39 建立用户表 图26.40 添加记录
(3)完成表的建立之后,就可以编写数据验证的代码了。打开网站ValidatorTest,将页面切换到“设计”视图。
(4)在“用户名”对应的输入框右边的表格中,再拖放一个CustomValidator用户自定义控件,并设置其属性如表26.8所示。
表26.8 设置CustomValidator的属性
属 性 | 属 性 值 | 属 性 | 属 性 值 |
ErrorMessage | 该用户名已经存在 | ControlToValidate | UserNameTxt |
Display | Dynamic |
(5)由于需要在服务器端进行数据验证,此处将用到服务器端验证事件ServerValidate。为此,选定CustomValidator控件,在“属性”窗口中的事件栏中找到ServerValidate。双击该项,为其编写数据验证事件处理程序,代码如下:
using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using System.Data.SqlClient;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
}
protected void CustomValidator1_ServerValidate(object source, Server
ValidateEventArgs args)
{
//实例化一个数据库连接
SqlConnection con = new SqlConnection();
//设置数据库连接字符串
con.ConnectionString = "Data Source=(local);Integrated Security= SSPI;"
+ "Initial Catalog=ASPDataBase";
//打开数据库
con.Open();
SqlCommand cmd = new SqlCommand();
//执行数据库查询
cmd.CommandText = "select count(*) from UserName where UserName='"
+ args.Value +"'";
cmd.Connection = con;
//数据类型转换
int result = Convert.ToInt32(cmd.ExecuteScalar());
//指定控件是否通过验证
if (result > 0)
{
args.IsValid = false;
}
else
{
args.IsValid = true;
}
}
}
程序首先引入命名空间System.Data.SqlClient,以调用操作数据库相关类。然后在ServerValidate的事件处理程序CustomValidator1_ServerValidate中编写处理代码。
前半部分代码用于打开数据库、查找数据库记录数,并把记录数返回给变量result。
下面这段代码用到了ServerValidateEventArgs的对象args。这是通过事件处理程序的参数传递下来的,用于传递事件数据。
if (result > 0)
{
args.IsValid = false;
}
else
{
args.IsValid = true;
}
其中的属性Value用于获取要验证的值,这个值就是用户输入文本框中的值,因此也可以使用常规的this.UserNameTxt.Text方法直接获取。而属性IsValid表示控件是否通过验证。程序中,当result大于0时表示数据库中已经有相同的记录了,因此将IsValid设置为false,使控件发生验证错误;反之则设置为true,使控件通过验证。运行程序,并输入数据,结果如图26.41所示。
图26.41 自定义验证结果
由于表中没有www这样的记录,因此单击“提交”按钮是不会出错的。而如果输入aaa这条记录,由于数据库中已经存放了该记录,单击“提交”按钮后,就会发生验证 错误。
当然,也可以通过在客户端编写脚本,实现CustomValidator控件的自定义验证。此时则需通过其属性ClientValidationFunction来设置验证脚本函数。
26.3.6 错误信息汇总控件ValidationSummary
错误信息汇总控件用于将页面中所有验证控件错误信息显示出来。如果验证控件分为不同的组时,则需要不同的ValidationSummary控件进行分组显示。默认情况下,页面控件都在一个组中。设置分组信息用到了ValidationGroup。ValidationSummary控件用法比较简单,下面将以前面的例程对其应用作简单的介绍,设计步骤如下。
(1)打开网站ValidatorTest,将页面切换到“设计”视图。在“提交”按钮所在行的表格中添加一个ValidationSummary控件。
(2)保持其属性为默认值,调整好布局,并运行程序,结果如图26.42所示。
单击“提交”按钮后可以看到,错误信息汇总控件ValidationSummary将页面中所有控件的错误信息都显示出来了。这时可以将页面上的其他控件的Display属性设置为None,即不显示出来,而直接汇总显示到ValidationSummary控件中,从而可以使页面布局更 紧凑。
图26.42 错误信息汇总
最后需要说明的是一个有关页面验证的属性,这就是IsValid,它是Page类中的一个属性。该属性用于指示整个页面是否全部验证通过。如果验证没有通过,则不提交到服务器端执行。当然,即使页面中有需要在服务器端验证的控件,如前面介绍的用户自定义验证控件CustomValidator,通过IsValid也可以判断整个页面验证是否全部通过。下面将介绍Isvalid的使用方法。
在程序页面中拖放一个Label控件,并将其ID设置为ResultLbl,用于显示整个页面的验证状态。双击“提交”按钮,为其编写事件处理程序,如下所示。
protected void Button1_Click(object sender, EventArgs e)
{
//判断页面验证是否全部通过
if (this.IsValid)
{
ResultLbl.Text = "页面验证成功";
}
else
{
ResultLbl.Text = "页面验证未成功";
}
}
运行程序,可以看到效果如图26.43所示。
当所有控件验证通过时,可以看到如图26.44所示运行结果。
图26.43 验证未