Web程序设计实验指导书1116

} }

最后，浏览建立的Web窗体查看效果。 3. 设计并实现一个用于单项选择题的测试页面 （1）设计Web窗体

新建一个Web窗体，切换到设计视图。如图2-7所示，向页面添加1个PlaceHolder控件、1个Botton控件和1个Label控件，适当调整个控件的大小和位置。

图2-7

（2）设置属性

Web窗体中各控件的初始属性设置如表2-3所示。

表2-3 各控件的属性设置表

控件 TextBox Label 属性名 ID Text ID Text （3）编写事件代码

Web窗体首次载入时执行的代码如下：

protected void Page_Load(object sender, EventArgs e) {

//定义Label控件lblQuestion1 Label lblQuestion1 = new Label(); lblQuestion1.ID = \

//设置题目要求。在实际工程中，数据来源于数据库 lblQuestion1.Text = \服务器控件不包括（ ）。\ //将lblQuestion1控件添加到PlaceHolder1中 //定义RadioButtonList控件rdoltChoice1

RadioButtonList rdoltChoice1 = new RadioButtonList(); rdoltChoice1.ID = \

//设置单项选择项。在实际工程中，数据来源于数据库 em(\ }

按钮btnSubmit被单击时执行的事件代码如下： protected void btnSubmit_Click(object sender, EventArgs e) {

//查找rdoltChoice1控件 RadioButtonList

rdoltChoice1

=

(RadioButtonList)PlaceHolder1.FindControl(\

lblDisplay.Text = \你选择了：\ }

（4）浏览建立的Web窗体进行测试。

属性值 btnSubmit 提交 lblDisplay 空 说明 “提交”按钮的编程名称 “提交”按钮上显示的文本 用来显示选择结果的Label控件编程名称 初始不显示任何内容 实验三 ASP.NET 3.5验证控件

一．实验目的

(1) 理解客户端和服务器端验证。

(2) 掌握ASP.NET 3.5各验证控件的使用。 (2) 掌握分组验证的方法。

二.实验内容及要求

1.设计并实现一个带验证控件的用户注册页面 要求如下：

(1)页面浏览效果如图3-1和图3-2所示

(2)“用户名”、“密码”、“确认密码”、“生日”、“电话号码”和“身份证号”等信息必须输入。

(3) “密码”和“确认密码”的输入值必须一致。 (4) “生日”的输入值必须在1900-1-1到2010-1-1之间。 (5) “电话号码”

(6) “身份证号”中的出生年月信息必须为合法的日期数据。 (7) 能汇总显示所有的验证错误信息，并以独立的对话框显示。

(8)当验证控件出现验证错误时，焦点会定位在出现验证错误的文本框中。 (9)若通过所有的验证，则显示“验证通过”的信息。

图3-1 “用户注册验证”浏览效果（1） 图3-2 “用户注册验证”浏览效果（2）

2.设计并实现同一个页面的分组验证功能 要求如下：

(1)页面浏览效果如图3-2所示

图3-3 “分组验证”浏览效果（1）

(2) 如图3-4所示，当点击“用户名是否可用”按钮时，仅对“用户名”进行验证。

图3-4 “分组验证”浏览效果（2）

(3) 如图3-5和图3-6所示，当在“用户名”文本框中输入jxssg，再单击“用户名是否可用”按钮时输出“抱歉！该用户名已被占用！”的信息；当在“用户名”文本框中输入其它信息，再单击“单击用户名是否可用”按钮时输出“恭喜！该用户名可用！”的信息。

图3-5 “分组验证”浏览效果（3） 图3-6 “分组验证”浏览效果（4）

(4) 如图3-7所示，当单击“确定”按钮时，对“密码”、“确认密码”、“生日”、“电话号码”和“身份证号”进行验证。

图3-7 “分组验证”浏览效果（5）

三.实验步骤

1. 设计并实现一个带验证控件的用户注册页面 （1）设计Web窗体

新建一个Web窗体，切换到设计视图。如图3-8所示，向页面输入“用户名”、“密码：”、“确认密码：”、“生日：”、“电话号码：”和“身份证号：”等信息；添加6个TextBox控件、6个RequiredFieldValidator控件、1个CompareValidator控件、1个RangeValidator控件、1个RegularExpressionValidator控件、1个CustomValidator控件，1个Botton控件、1个Label控件和1个ValidatorSummary控件。适当调整个控件的位置和大

小。

图3-8 设计界面（1）

（2）设置属性

Web窗体中各控件的属性设置如表3-1所示。

表3-1 各控件的属性设置表

控件 TextBox RequiredFieldValidator 属性名 ID ID 属性值 txtName rfvName 说明 “用户名”文本框的编程名称 “必须输入验证”控件的编程名称 ControlToValidate ErrorMessage txtName 请输入用户名 验证“用户名”文本框 验证无效时在“汇总验证”控件中显示的错误信息 SetFocusOnError True 验证无效时将焦点定位到“用户名”文本框 Text TextBox ID TextMode RequiredFieldValidator ID * txtPassword Password rfvPassword 验证无效时提示的错误信息 “密码”文本框的编程名称 设置“密码”文本框为密码模式 “必须输入验证”控件的编程名称 ControlToValidate ErrorMessage txtPassword 请输入密码 验证“密码”文本框 验证无效时在“汇总验证”控件中显示的错误信息 SetFocusOnError True 验证无效时将焦点定位到“密码”文本框 Text TextBox ID TextMode * txtPasswordAgain Password 验证无效时提示的错误信息 “确认密码”文本框的编程名称 设置“确认密码”文本框为密码模式 RequiredFieldValidator ID rfvPasswordAgain “必须输入验证”控件的编程名称 ControlToValidate ErrorMessage txtPasswordAgain 请输入确认密码 验证“确认密码”文本框 验证无效时在“汇总验证”控件中显示的错误信息 SetFocusOnError True 验证无效时将焦点定位到“确认密码”文本框 Text CompareValidator ID ControlToCompare ControlToValidate ErrorMessage * cvPassword TxtPassword TxtPasswordAgain 密码与确认密码不一致 验证无效时提示的错误信息 “比较验证”控件的编程名称 与“密码”文本框比较 验证“确认密码”文本框 验证无效时在“汇总验证”控件中显示的错误信息 SetFocusOnError True 验证无效时将焦点定位到“确认密码”文本框 TextBox RequiredFieldValidator ID ID txtBirthday rfvBirthday “生日”文本框的编程名称 “必须输入验证”控件的编程名称 ControlToValidate ErrorMessage txtBirthday 请输入生日 验证“生日”文本框 验证无效时在“汇总验证”控件中显示的错误信息 SetFocusOnError True 验证无效时将焦点定位到“生日”文本框 Text * 验证无效时提示的错误信息