1、ASPNET纸质大作业延安大学ASP.NET期末作业学号： 姓名： 秦红志 班级： 信息14 学期： 2017.3-2017-7 实现步骤网站由3个ASP.NET网页组成，分别为登录界面（Default.aspx）、注册界面（Sign.aspx）、通讯录管理查询界面（Txgl.aspx）。一、 设计登录界面（Default.aspx）1) 设计Web页面新建一个ASP.NET网站，在Default.aspx页面中添加1个Panel控件Panel1，向Panel控件中添加用于布局的HTML表格。添加必要的说明文字，2个文本框TextBox1和TextBox2；2个必须项验证控件RequireFi
2、eld1和RequireField1；1个正则表达式验证控件RegularExpressValidator1；1个验证摘要控件ValidationSummary1；3个超链接控件HyPerLink1HyperLink3；两个命令按钮控件Button1、Button2，之间用空格拉开距离，页面布局如图1所示。图1 设计登录界面2) 设置对象属性在设计视图中分别选中各控件，并在属性窗口中设置其属性。各控件的属性值设置情况见表1。表1 各控件对象的属性设置控件ID属性属性值说明HyperLink1NavigateUrl/Default.aspx?NewTheme=Default超链接向Default
3、Url传递名为NewTheme的变量Text默认超链接1控件上显示的文本HyperLink2NavigateUrl/Default.aspx?NewTheme=Green超链接向DefaultUrl传递名为NewTheme的变量Text绿色超链接2控件上显示的文本HyperLink3NavigateUrl/Default.aspx?NewTheme=Blue超链接向DefaultUrl传递名为NewTheme的变量Text蓝色超链接3控件上显示的文本TextBox1IDTUser文本框1在程序中使用的名称TextBox2IDTPass文本框2在程序中使用的名称TextModePassword文
4、本框2字符以“”显示Button1IDBLogin按钮1在程序中使用的名称Text登录按钮1控件上显示的文本Button2IDBSign按钮2在程序中使用的名称Text注册按钮2控件上显示的文本CausesValidationFalse用于执行按钮命令时让验证控件失效控件ID属性属性值说明RequiredFieldValidator1ControlToValidateTUser设置验证控件控制对象为TUserText用户名不能为空验证失败时控件显示的文本ErrorMessage请您输入用户名验证失败时用于显示在验证摘要控件中的错误信息RequiredFieldValidator2Control
5、ToValidateTPass设置验证控件控制对象为TPassText密码不能为空验证失败时控件显示的文本ErrorMessage请您输入密码验证失败时用于显示在验证摘要控件中的错误信息DisplayDynamic设置验证控件显示方式为动态RegularExpressionValidator1ControlToValidateTPass设置验证控件控制对象为TPassValidationExpressiond6,12设置正则表达式，表示输入字符长度范围Text密码长度在6-12位验证失败时控件显示的文本ErrorMessage密码位数不在6-12内验证失败时用于显示在验证摘要控件中的错误信息D
6、isplayDynamic设置验证控件显示方式为动态3) 登录界面各功能实现方法及代码：i. 登录界面换主题功能的实现方法：创建1个名为images的文件夹，将事先准备好的背景图片复制到该文件夹中。a) 添加主题和级联样式表文件在解决方案资源管理器中，向网站中添加Default、Green和Blue3个主题文件夹。向各主题文件夹中添加同名的主题文件Default.skin、Green.skin和Blue.skin。向主题文件夹中添加同名的级联样式表文件Default.css、Green.css和Blue.css，将images文件夹拖入到App_Theme文件夹中。各主题文件和级联样式表文件内
7、容如下。Default.skin的代码如下所示:Default.css文件的代码如下：#login background-color:#F5FBFB;使用“复制”、“修改”的方法基于Default.skin创建Green.skin文件，其代码如下所示：Green.skin的代码如下所示:Green.css文件的代码如下：#login background-image:url(./images/2.jpg);#msg background-image:url(./images/2.jpg);使用“复制”、“修改”的方法基于Default.skin创建Blue.skin文件，其代码如下所示：Blu
8、e.skin的代码如下所示:Blue.css文件的代码如下：#login background-image:url(./images/3.jpg); color:White; #msg background-image:url(./images/3.jpg); color:White;b) 编写程序代码切换到Default.aspx的源视图，在Page指令中添加对默认主题的引用：双击页面空白区域，切换到Default.aspx.cs的代码编辑窗口，在窗口中输入如下代码。页面装入时执行的事件代码如下： protected void Page_PreInit() /Page_PerInit事件发生
9、在Page_Load事件之前，此时StyleSheetTheme属性值尚未应用 /获取由“？”传递来的变量值，并赋给页面（this）的Theme属性。 /页面Page指令中设置的StyleSheetTheme属性值将被Theme属性覆盖 this.Theme = Request.QueryStringNewTheme; ii. 登录功能实现方法：登录用户信息存放在Access数据库ad.accdb的User表中，包括Uno、Uname、Upart、Uphone、Usex、Upass和Ulevel7个字段，分别用于存放员工号、姓名、部门、电话、性别、密码、用户级别。如图2所示。图2 User表的
10、内容编写程序代码切换到Default.apsx的代码窗口编写事件处理代码。由于登录用到了数据库连接与访问的对象，因此在代码区最上方添加对相应命名空间的引用。using ;using ;页面装入时执行的事件代码如下： protected void Page_Load(object sender, EventArgs e) this.Title = 通讯录查询系统登录; TUser.Focus(); “登录”按钮被单击时执行的事件代码如下： protected void BLogin_Click(object sender, EventArgs e) /将文本框中输入的信息存放在下面的字符串当中
11、string username = TUser.Text; string password = TPass.Text; /连接语句 string str = + Server.MapPath(App_Data/ad.accdb); OleDbConnection Conn = new OleDbConnection(str); Conn.Open(); OleDbCommand cmd = Conn.CreateCommand(); /输入SQL语句 cmd.CommandText = SELECT * FROM User WHERE Uname=username; (new OleDbPar
12、ameter(Uname, username); OleDbDataReader reader = cmd.ExecuteReader(); /判断用户名是否合法 if (reader.Read() = true) /读取该用户名的密码信息与用户级别信息 string pwd = reader.GetString(reader.GetOrdinal(Upass); string lel = reader.GetString(reader.GetOrdinal(Ulevel); if (pwd = password) /密码合法时将用户密码确认信息与用户级别信息存入session中 Sessio
13、npass = yes; SessionLevel = lel; /跳转到通讯管理界面 Response.Redirect(./Txgl.aspx); Conn.Close(); else /密码错误时对话框提醒信息 Response.Write(alert(密码错误); TPass.Text = ; return; else /用户名不存在时对话框信息 Response.Write(alert(用户名错误); TUser.Text = ; TPass.Text = ; return; “注册”按钮被单击时执行的事件代码如下： protected void BSign_Click(object
14、 sender, EventArgs e) Response.Redirect(./Sign.aspx); 二、 设计注册界面（Sign.aspx）1) 设计Web页面在网站中添加一个新的Web窗体，在页面中添加1个用于布局的HTML表格。如图3所示，在页面中添加必要的文字说明。添加4个TextBox控件TextBox1TextBox4；添加1个下拉列表DropDownList控件;1个RadioButtonList控件；1个按钮控件Button1。5个必须项验证控件RequireField1 RequireField5；2个正则表达式验证控件RegularExpressValidator1；
15、1个比较验证控件CompareValidator。图3 Sign.aspx界面设计2) 设置对象属性用户名、手机号、密码、确认密码后的TextBox的ID属性分别设置为Uname、UPhone、Upass、Uconfirm。Upass、Uconfirm的TextMode属性都设为Password。Button按钮的ID属性设为SignOK，Text属性设为注册。验证控件的属性值设置情况见表2。表2 各控件对象的属性设置控件ID属性属性值RequiredFieldValidator1ControlToValidateUnameForeColorRedText*请您输入用户名RequiredFie
16、ldValidator2ControlToValidateDropDownList1ForeColorRedText*请您选择部门InitialValue-选择部门-控件ID属性属性值RequiredFieldValidator3ControlToValidateUphoneForeColorRedText*请您输入手机号DisplayDynamicRequiredFieldValidator4ControlToValidateUpassForeColorRedText*请输入密码DisplayDynamicRequiredFieldValidator5ControlToValidateUCo
17、nfirmForeColorRedText*请输入密码DisplayDynamicRegularExpressionValidator1ControlToValidateUConfirmForeColorRedText*密码长度为612位DisplayDynamicValidationExpressiond6,12RegularExpressionValidator2ControlToValidateUphoneForeColorRedText*号码格式不正确DisplayDynamicValidationExpressiond5,11CompareValidator1ControlToVal
18、idateUConfirmControlToCompareUpassForeColorRedText*两次密码输入不一致DisplayDynamic说明：DropdownList1的Items中添加成员“-选择部门-”。RadioButtonList1的Items中添加成员“男”和“女”，成员“男”的Selected属性为True，使页面加载时按钮默认选择“男”。RequiredFieldValidator2验证控件中的InitialValue属性设置返回内容的初始值为“-选择部门-”，用来验证是否选择了部门。3) 编写程序代码引用需要的命名空间。代码如下：using ;using ;页面装入
19、时执行的代码如下： protected void Page_Load(object sender, EventArgs e) this.Title = 通讯录查询注册页面; if (!IsPostBack) /页面初次加载时，下拉列表框中添加的项生活部);宣传部);人事部);办公室);服务部); Uname.Focus(); “注册”按钮被单击时执行的事件代码如下： protected void SignOK_Click(object sender, EventArgs e) string username = Uname.Text; string string phone = Uphone.
20、Text; string string pass = UPass.Text; string str= + Server.MapPath(App_Data/ad.accdb); OleDbConnection Conn = new OleDbConnection(str); Conn.Open(); OleDbCommand cmd = Conn.CreateCommand();/默认传递的用户级别为2，即普通用户。 cmd.CommandText= INSERT INTO User(Uname, Upart, Uphone, Usex, Upass,Ulevel)VALUES (usernam
21、e,part,phone,sex,pass,2); (new OleDbParameter(username, username); (new OleDbParameter(part, part); (new OleDbParameter(phone, phone); (new OleDbParameter(sex, sex); (new OleDbParameter(pass, pass); cmd.ExecuteNonQuery(); Response.Write(alert(注册成功|);window.location=Default.aspx;); 三、 设计通讯录管理查询界面（Txg
22、l.aspx）1) 设计Web页面在网站中添加一个新的Web窗体。向其中添加必要的文字说明。添加1个下拉列表框DropDownList1,1个文本框控件TextBox。3个按钮控件Button1Button3。2个用于显示数据库的数据的GridView1（普通用户可见）、FormView1（管理员用户可见）和4个AccessDataSource1 AccessDataSource4控件，分别用于按员工号、姓名、部门查询记录的情况。用于实现局部更新AJAX技术的1个SciptManager1控件和1个UpdatePanel1控件。如图4所示。图4 Txgl.aspx界面设计2) 设置对象属性设置
23、文本框TextBox的ID属性为Query，设置按钮控件Button1 Button3的ID属性分别为ButtonQuery、ButtonALL、ButtonExit。Text属性分别为“查询”、“显示全部”、“退出”。选中AccessDataSource1，在其任务菜单中执行“配置数据源”命令，在打开的对话框中单击“浏览”按钮，选择事先已存放在网站App_Data文件夹中的ad.accdb文件。在“配置Select语句”对话框中选择“指定自定义SQL语句或存储过程”。单击“下一步”按钮，在打开的对话框，输入如下所示的SQL语句。SELECT * FROM User WHERE(Uno=?)单
24、击“下一步”按钮，在打开的对话框中设置查询条件为Uno列的数据等于Query的Text属性值。AccessDataSource2和AccessDataSource3的设置与前面1的设置基本相同，只是在设置WHERE子句时设置的查询条件不同，具体设置如图4和图5所示。为了使程序支持“模糊查询”，在按姓名、部门查询时使用了LIKE运算符。图5 按姓名查询的WHERE子句设置图6 按班级查询的WHERE子句设置AccessDataSource4的设置，去掉了WHERE子句部分。无条件返回所有记录。说明：GridView和FormView控件都统一放在UpdatePanel内用于实现AJAX的局部更新
25、。3) 编写程序代码为了在GridView控件中显示中文的列表题，需要切换到Txgl.aspx页面的源视图，按如下所示修改GridView1控件中的描述代码。 页面装入时执行的事件代码如下： protected void Page_Load(object sender, EventArgs e) /先将数据表显示控件设置为不可见 GridView1.Visible = false; FormView1.Visible = false; /判断登陆界面的状态管理Session信息 if (string)(Sessionpass) != yes) /禁止非法用户直接输入通讯管理界面网址来到界面 R
26、esponse.Write(alert(直接来到这里可是非常没礼貌的行为呦！); Server.Transfer(Default.aspx); else this.Title = 欢迎使用通讯录查询系统; /判断用户级别信息，用于显示不同的表界面。 if (string)(SessionLevel) = 1) FormView1.Visible = true; GridView1.DataSource = user; GridView1.DataBind(); else GridView1.Visible = true; GridView1.DataSource = user; GridVie
27、w1.DataBind(); /为下拉列表框中添加成员 if (!IsPostBack) 员工号);姓名);部门); Query.Focus(); “查询”按钮被单击时执行的事件代码如下： protected void ButtonQuery_Click(object sender, EventArgs e) if (Query.Text = ) Response.Write(alert(查询关键字不能为空?); return; switch (DropDownList1.Text) case 员工号: GridView1.DataSource = AccessDataSource1; GridView1.DataBi
