HTML控件和验证控件.ppt

1、3.2 HTML 控件和验证控件,2,回顾,在ASP.NET中，控件分成HTML服务控件和Web服务控件两种 所有的 ASP.NET Web 服务器控件都派生自 System.Web.UI.WebControls 命名空间 使用Web服务器控件需要注意AutoPostBack的使用 Web 服务器控件可以分为： 文本输入控件 控制权转移控件 选择控件 容器控件 其它专用控件,3,目标,使用各种HTML控件 理解HTML控件和Web控件的区别 使用各种验证控件,4,ASP.NET HTML 控件简介,HTML 服务器控件是由 ASP.NET 更新的标准 HTML 标签，通过添加 runat=“s

2、erver” 属性将其用作服务器控件,HTML 标签,runat=server,HTML 服务器控件,HTML 服务器控件属于 System.Web.UI.HTMLControls 命名空间，派生自 HTMLControl 基类,5,HTML 控件与 Web 控件的区别 3-1,HTML 控件,比较灵活 功能较少 在客户端运行窗体且不需用户结合多种功能时使用 4.可用来将 ASP 应用程序导入 ASP.NET,Web 控件,具备多种控件编程功能 包含大量控件 在服务器端运行窗体时使用 具备更加完善的功能来处理存储在数据库中的数据 可在可视化设计环境中使用,6,往返过程： 浏览器向用户显示一个窗

3、体，用户与该窗体进行交互，这导致该窗体回发到服务器。但是，因为与服务器组件进行交互的所有处理必须在服务器上发生，这意味着对于要求处理的每一操作而言，必须将该窗体发送到服务器、进行处理、然后返回到浏览器。,HTML 控件与 Web 控件的区别 3-2,7,无状态性： 客户端向服务器发送一个请求（譬如你在IE栏输入网址，回车），服务器接到请求，响应请求（处理事件），服务器完成处理后将生成的web页发送回浏览器，然后就清除该页的信息，释放服务器资源。服务再等待下一次请求，即使下一次是请求同一页，服务器重新开始创建和处理该页。服务器就是这样不停的重复这一过程。服务器不记录页面的状态或信息的特性我们就称

4、之为“无状态性”。,HTML 控件与 Web 控件的区别 3-3,8,HTML 服务器控件的类型,9,HtmlForm 控件 2-1,此控件是一种服务器控件，用于表示可作为容器容纳 Web页面中各种元素的窗体 所有 HTML 控件和 Web 控件均置于 HTMLForm 控件内 HtmlForm 控件由以下标签表示：, ,10,用户界面,HtmlForm 控件 2-2,private void btnSubmit_ServerClick(object sender, System.EventArgs e) lblSubmit.InnerHtml=此按钮为“提交”按钮！; private voi

5、d btnClear_ServerClick(object sender, System.EventArgs e) lblClear.InnerHtml=此按钮为“清除”按钮！; ,窗体的输出结果,11,HtmlImage 控件 2-1,此控件是用于显示图像的一种服务器端控件 它可以动态设置并获取来源、宽度、高度、边框宽度、备用文本和对齐方式等各种图像属性 HtmlImage 控件由以下标签表示：,img id=“id 名称” alt=“替代文本 runat=server align=left/right/top/middle/bottom border=“边框宽度 height=“图像高度

6、src=“图像 URL width=“图像宽度,12,HtmlImage 控件 2-2,private void btnChange_ServerClick(object sender, System.EventArgs e) if(int.Parse(ViewStateCount.ToString()%2=1) imgShow.Src=imagesflower.gif; else imgShow.Src=imagesfinger.gif; ViewStateCount=int.Parse(ViewStateCount.ToString()+1; ,13,HtmlInputFile 控件 2-

7、1,此控件用于将文件从 ASP.NET 页面上载到服务器中 此控件将显示一个文本框和一个浏览按钮，以便上载文件 HtmlInputFile 控件由以下标签表示：,14,HtmlInputFile 控件 2-2,private void btnUpload_ServerClick(object sender, System.EventArgs e) string strFileName=this.File1.PostedFile.FileName; int nLength=strFileName.Length-strFileName.LastIndexOf()-1; strFileName=st

8、rFileName.Substring(strFileName.LastIndexOf()+1, nLength); string strPath=Server.MapPath()+ Upload; File1.PostedFile.SaveAs(strPath+strFileName); ,15,ASP.NET 中的验证控件,为使用户更正输入错误或无效的数据，始终需要对用户输入的数据进行检查并显示错误消息 验证将由在客户端或服务器中运行的验证代码执行 ASP.NET 提供了许多验证控件，用以检查输入并使验证数据更加简单方便 与其他服务器控件一样，验证控件也被添加在 ASP.NET 页面中,1

9、6,ASP.NET 中的验证控件,17,RequiredFieldValidator控件 3-1,此控件用于检查任何窗体控件中是否包含值 如果控件中不含任何值，则会生成错误消息,提交窗体,这些字段中是否有任何字段为空？,18,RequiredFieldValidator控件 3-2,将所有控件放入窗体，同时应验证姓名和年龄输入是否为空,从工具箱中选择 RequiredFieldValidator 控件,为每个文本框置入一个 RequiredFieldValidator 控件，并按下一页所示设置各个控件的属性,19,RequiredFieldValidator控件 3-3,姓名字段中含有一个值，

10、因此验证后未显示错误,年龄字段为空，因此验证后显示错误消息,20,CompareValidator 控件 3-1,将一个窗体字段中输入的值与一个固定值或另一个控件中输入的值进行比较，并检查值的类型,检查 ID 是否为数字,检查日期是否有效,检查截止日期是否 迟于起始日期,选择三个 CompareValidator 控件,21,CompareValidator 控件 3-2,检查 ID：,检查起始日期：,检查截止日期：,22,CompareValidator 控件 3-3,ID 应为整数值,日期值无效,ID 正确,日期正确,截止日期应迟于起始日期,23,RangeValidator 控件 2-1

11、,检查窗体字段的值是否介于最小值与最大值之间 最小值和最大值可以为日期、号码、币值或字符串,选择两个 RangeValidator 控件,ID 应介于 1 与 100 之间,旅行日期应设于随后 3 个月内,24,RangeValidator 控件 2-2,private void Page_Load(object sender, System.EventArgs e) RangeVal2.MinimumValue= Convert.ToString (System.DateTime.Now.ToShortDateString(); RangeVal2.MaximumValue= Convert

12、.ToString (System.DateTime.Now.AddMonths(3).ToShortDateString(); private void btnSubmit_Click(object sender, System.EventArgs e) if ( IsValid) lblMessage.Text = “您好” + txtId.Text + “ 你的旅行日期为： + txtJdate.Text; ,将最小值设置为当前日期,将最大值设置为自当前日期起的 3 个月,如果输入无任何错误,ID 未介于 1 与 100 之间,输入的日期已过期，而未在随后三个月内,25,正则表达式 2-

13、1,正则表达式用于进行类型匹配 正则表达式可使用文字文本逐字匹配 它还可以使用元字符与复杂的字符序列相匹配 以下为几种常用的符号（更多的参见书本）,26,正则表达式 2-2,27,RegularExpressionValidator控件3-1,用于将在窗体字段中输入的值与正则表达式进行匹配 此控件通常与文本框控件一起使用，以检查电子邮件 ID、电话号码、信用卡号码、用户名和密码等是否有效,28,RegularExpressionValidator控件3-2,选择三个 RegularExpressionValidator 控件,姓名应介于 2 至 50 个字符之间,应以有效的电子邮件格式填写 电

14、子邮件地址，如 ,电话号码应为 10 位数,29,RegularExpressionValidator控件3-3,用来验证姓名的控件的验证表达式的值： w2-50,用来验证电子邮件的控件的验证表达式的值： w+(-+.w+)*w+(-.w+)*.w+(-.w+)*,用来验证电话号码的控件的验证表达式的值： 0-910,在字段中输入的值与正则表达式不匹配,30,CustomValidator 控件 3-1,按照用户指定的标准进行验证 可在特定情况下无法使用任何标准验证控件时使用 通常用来验证存储在特定数据库中的数据,选择并放置一个 CustomValidator 控件，以检查用户输入的密码,31

15、,CustomValidator 控件 3-2,CustomValidator 控件的属性,private void CustomValidator1_ServerValidate(object source, System.Web.UI.WebControls.ServerValidateEventArgs args) strVal = args.Value.ToUpper(); if ( strVal.Equals(ADMINISTRATOR) ) args.IsValid = true; else args.IsValid = false; private void btnLogin_C

16、lick(object sender,System.EventArgs e) if ( CusVal1.IsValid ) lblMessage.Text = “恭喜！; ,触发 CustomValidator 控件的 ServerValidate 事件,使用 CustomValidator 代码验证密码字段,如果用户输入的密码正确,32,CustomValidator 控件 3-3,如果输入的密码错误，则显示错误消息,输入的密码正确,33,ValidationSummary 控件 2-1,显示窗体中生成的所有错误的摘要 摘要可以按多种模式显示：列表、项目列表或单独一段,将所有其他验证控件放入

17、窗体,在窗体中放入一个 ValidationSummary 控件,34,ValidationSummary 控件 2-2,ValidationSummary 控件的属性,显示一个消息框， 用以显示错误消息,显示所有错误的摘要,窗体中的错误,35,Page.IsValid 属性,该属性为 Web 窗体页中的一个属性，用于检查页面中的所有验证控件是否均已成功进行验证 如果页面验证成功，则将具有值 True，否则将具有值 False,private void ValidateBtn_Click(Object Sender, System.EventArgs e) if (Page.IsValid = true) lblMessage.Text = “页面有效; else lblMessage.Text = “页面中存在一些错误; ,检查页面验证是否已经成功,36,总结,HTML服务控件和Web服务控件的区别 RequiredFieldva