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 * 验证无效时提示的错误信息