HTML控件和验证控件

第四章章HTML控控件件和验验证控控件回顾在ASP.NET中中，控控件分分成HTML服服务控控件和和Web服服务控控件两两种所有的的ASP.NETWeb服服务器器控件件都派派生自自System.Web.UI.WebControls命命名空空间使用Web服务务器控控件需需要注注意AutoPostBack的的使用用Web服服务器器控件件可以以分为为：文本输输入控控件控制权权转移移控件件选择控控件容器控控件其它专专用控控件2目标使用各各种HTML控控件理解HTML控控件和和Web控控件的的区别别使用各种种验证控控件3ASP.NETHTML控控件简简介HTML服务务器控件件是由ASP.NET更更新的标标准HTML标签签，通过过添加runat=“server”属属性将将其用作作服务器器控件HTML标签runat="server"HTML服务器控控件HTML服务务器控件件属于System.Web.UI.HTMLControls命命名空空间，派派生自HTMLControl基基类4HTML控件件与Web控控件的的区别3-1HTML控件件比较灵活活功能较少少在客户端端运行窗窗体且不不需用户户结合多多种功能能时使用用4.可可用来将将ASP应应用程序序导入ASP.NETWeb控控件具备多种种控件编编程功能能包含大量量控件在服务器器端运行行窗体时时使用具备更加加完善的的功能来来处理存存储在数数据库中中的数据据可在可视视化设计计环境中中使用5往返过程：：浏览器向用用户显示一一个窗体，，用户与该该窗体进行行交互，这这导致该窗窗体回发到到服务器。。但是，因因为与服务务器组件进进行交互的的所有处理理必须在服服务器上发发生，这意意味着对于于要求处理理的每一操操作而言，，必须将该该窗体发送送到服务器器、进行处处理、然后后返回到浏浏览器。HTML控控件与Web控控件的区区别3-26无状态性：：客户端向服服务器发送送一个请求求（譬如你你在IE栏栏输入网址址，回车）），服务器器接到请求求，响应请请求（处理理事件），，服务器完完成处理后后将生成的的web页页发送回浏浏览器，然然后就清除除该页的信信息，释放放服务器资资源。服务务再等待下下一次请求求，即使下下一次是请请求同一页页，服务器器重新开始始创建和处处理该页。。服务器就就是这样不不停的重复复这一过程程。服务器器不记录页页面的状态态或信息的的特性我们们就称之为为“无状态态性”。HTML控控件与Web控控件的区区别3-37HTML服服务器控控件的类型型HTML控件HtmlAnchorHtmlButtonHtmlFormHtmlImageHtmlInputButtonHtmlInputFileHtmlInputImageHtmlInputRadioButtonHtmlInputTextHtmlTable8HtmlForm控控件2-1此控件是一一种服务器器控件，用用于表示可可作为容器器容纳Web页面面中各种元元素的窗体体所有HTML控件和Web控件均置于于HTMLForm控件内HtmlForm控控件由以以下标签表表示：<formid=“id名称"method=POST/GETaction=“目目的页面的的URL"runat="server"<!—ASP.NETControls--></form>9用户界面HtmlForm控控件2-2privatevoidbtnSubmit_ServerClick(objectsender,System.EventArgse){lblSubmit.InnerHtml="此按钮为为“提交””按钮！！！";}privatevoidbtnClear_ServerClick(objectsender,System.EventArgse){lblClear.InnerHtml="此此按钮为““清除”按按钮！！";}窗体的输出出结果10HtmlImage控件2-1此控件是用用于显示图图像的一种种服务器端端控件它可以动态态设置并获获取来源、、宽度、高高度、边框框宽度、备备用文本和和对齐方式式等各种图图像属性HtmlImage控件由由以下标签签表示：<imgid=““id名名称”alt=““替代文本本"runat="server"align=left/right/top/middle/bottomborder=“边边框宽度"height=“图图像高度"src=““图像URL"width=“图像像宽度"11HtmlImage控件2-2privatevoidbtnChange_ServerClick(objectsender,System.EventArgse){if(int.Parse(ViewState["Count"].ToString())%2==1){imgShow.Src="images\\flower.gif";}else{imgShow.Src="images\\finger.gif";}ViewState["Count"]=int.Parse(ViewState["Count"].ToString())+1;}12HtmlInputFile控件2-1此控件用于于将文件从从ASP.NET页页面上载到到服务器中中此控件将显显示一个文文本框和一一个浏览按按钮，以便便上载文件件HtmlInputFile控件由以下下标签表示示：<inputtype=fileid=“ID名称称"postedfile=“将将要上载的的文件"runat="server">13HtmlInputFile控控件2-2privatevoidbtnUpload_ServerClick(objectsender,System.EventArgse){stringstrFileName=this.File1.PostedFile.FileName;intnLength=strFileName.Length-strFileName.LastIndexOf("\\")-1;strFileName=strFileName.Substring(strFileName.LastIndexOf("\\")+1,nLength);stringstrPath=Server.MapPath("\\")+"Upload\\";File1.PostedFile.SaveAs(strPath+strFileName);}14ASP.NET中中的的验验证证控控件件为使使用用户户更更正正输输入入错错误误或或无无效效的的数数据据，，始始终终需需要要对对用用户户输输入入的的数数据据进进行行检检查查并并显显示示错错误误消消息息验证证将将由由在在客客户户端端或或服服务务器器中中运运行行的的验验证证代代码码执执行行ASP.NET提提供供了了许许多多验验证证控控件件，，用用以以检检查查输输入入并并使使验验证证数数据据更更加加简简单单方方便便与其其他他服服务务器器控控件件一一样样，，验验证证控控件件也也被被添添加加在在ASP.NET页页面面中中15ASP.NET中中的的验验证证控控件件验证控件RequiredFieldValidatorCompareValidatorRangeValidatorRegularExpressionValidatorCustomValidatorValidationSummary16RequiredFieldValidator控控件件3-1此控控件件用用于于检检查查任任何何窗窗体体控控件件中中是是否否包包含含值值如果果控控件件中中不不含含任任何何值值，，则则会会生生成成错错误误消消息息提交交窗窗体体这些些字字段段中中是是否否有有任任何何字字段段为为空空？？方法Validate属性ControlToValidateErrorMessageText17RequiredFieldValidator控控件件3-2将所所有有控控件件放放入入窗窗体体，，同同时时应应验验证证姓姓名名和和年年龄龄输输入入是是否否为为空空从工工具具箱箱中中选选择择RequiredFieldValidator控控件件为每每个个文文本本框框置置入入一一个个RequiredFieldValidator控控件件，，并并按按下下18RequiredFieldValidator控控件件3-3属性值IdRFV1ControlToValidatetxtNameText请输入姓名！！ForeColorRed属性值IdRFV2ControlToValidatetxtAgeText*ErrorMessage请输入年龄！ForeColorRed姓名字段中含含有一个值，，因此验证后后未显示错误误年龄字段为空空，因此验证证后显示错误误消息19CompareValidator控件3-1将一个窗体字字段中输入的的值与一个固固定值或另一一个控件中输输入的值进行行比较，并检检查值的类型型检查ID是是否为数字字检查日期是否否有效检查截止日期期是否迟于起始日期期属性ControlToCompareControlToValidateDisplayEnabledErrorMessageIsValidTextValueToCompare方法Validate选择三个CompareValidator控件20CompareValidator控件3-2属性值IDComVal1ControlToValidatetxtIdDisplayStaticTextID无效ForeColorRedOperatorDataTypeCheckTypeInteger检查ID：：检查起始日期期：检查截止日期期：属性值IDComVal2ControlToValidatetxtSdateDisplayStaticText日期有效ForeColorRedOperatorDataTypeCheckTypeDate属性值IDComVal3ControlToComparetxtSdateControlToValidatetxtEdateDisplayStaticText截止日期应迟于起始日期ForeColorRedOperatorGreaterThanTypeInteger21CompareValidator控件3-3ID应为整整数值日期值无效ID正确日期正确截止日期应迟迟于起始日期期22RangeValidator控控件2-1检查窗体字段段的值是否介介于最小值与与最大值之间间最小值和最大大值可以为日日期、号码、、币值或字符符串选择两个RangeValidator控控件ID应介于于1与100之之间旅行日期应设设于随后3个月内属性ControlToValidateDisplayEnabledErrorMessageIsValidMaximumValueMinimumValueText方法Validate23RangeValidator控控件2-2privatevoidPage_Load(objectsender,System.EventArgse){RangeVal2.MinimumValue=Convert.ToString(System.DateTime.Now.ToShortDateString());RangeVal2.MaximumValue=Convert.ToString(System.DateTime.Now.AddMonths(3).ToShortDateString());}privatevoidbtnSubmit_Click(objectsender,System.EventArgse){if(IsValid){lblMessage.Text=“您好好”+txtId.Text+“你你的旅行日期期为："+txtJdate.Text;}}将最小值设置置为当前日期期将最大值设置置为自当前日日期起的3个月如果输入无任任何错误ID未介于于1与100之之间输入的日期已已过期，而未未在随后三个个月内24正则表达式2-1正则表达式用用于进行类型型匹配正则表达式可可使用文字文文本逐字匹配配它还可以使使用元字符符与复杂的的字符序列列相匹配以下为几种种常用的符符号（更多多的参见书书本）符号含义^字符串开始处$字符串结束[a-z]是否是a-z中的一个\w允许输入任何值\d{3}“\d”指定输入的值是一个数字,{}表示已指定数据类型的出现次数+表明一个或多个元素将被添加到正在检查的表达式25正则表达式式2-2例如：国内电话号码的表达式(\(0\d{2,3}\)|0\d{2,3}-)?\d{7,8}(-\d{1,4})?解释：(\(0\d{2,3}\)|0\d{2,3}-)??表示前面的出现0或1|表示或者，即\(0\d{2,3}\)或者0\d{2,3}-也就是区号可以用(010)，(0871)，010-,0871-表示；\d{7,8}表示7位或者8位数字电话号码(-\d{1,4})?？表示出现0或1次，即1到4位分机号或者没有分机号以下的都算满足：12345678010)1234567811234等。26RegularExpressionValidator控件3-1用于将在窗窗体字段中中输入的值值与正则表表达式进行行匹配此控件通常常与文本框框控件一起起使用，以以检查电子子邮件ID、电话话号码、信信用卡号码码、用户名名和密码等等是否有效效属性ControlToValidateDisplayEnabledErrorMessageIsValidTextValidationExpression方法Validate27RegularExpressionValidator控件3-2选择三个RegularExpressionValidator控件姓名应介于于2至至50个个字符之之间应以有效的的电子邮件件格式填写写电子邮件地地址，如abc@电话号码应应为10位数28RegularExpressionValidator控件3-3用来验证姓姓名的控件件的验证表表达式的值值：\w{2-50}用来验证电电子邮件的的控件的验验证表达式式的值：\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*用来验证电电话号码的的控件的验验证表达式式的值：[0-9]{10}在字段中输输入的值与与正则表达达式不匹配配29CustomValidator控件3-1按照用户指指定的标准准进行验证证可在特定情情况下无法法使用任何何标准验证证控件时使使用通常用来验验证存储在在特定数据据库中的数数据选择并放置置一个CustomValidator控控件，以检检查用户输输入的密码码属性ControlToValidateDisplayEnabledErrorMessageIsValidText方法OnServerValidateValidate事件ServerValidate30CustomValidator控件3-2CustomValidator控控件的属性性属性值IDCusVal1ControlToValidatetxtPassDisplayDynamicText请输入有效密码ForeColorRedprivatevoidCustomValidator1_ServerValidate(objectsource,System.Web.UI.WebControls.ServerValidateEventArgsargs){strVal=args.Value.ToUpper();if(strVal.Equals("ADMINISTRATOR")){args.IsValid=true;}else{args.IsValid=false;}}privatevoidbtnLogin_Click(objectsender,System.EventArgse){if(CusVal1.IsValid){lblMessage.Text=“恭恭喜！！";}}触发CustomValidator控控件的ServerValidate事件件使用CustomValidator代码验证密密码字段如果用户输输入的密码码正确31CustomValidator控件3-3如果输入的的密码错误误，则显示示错误消息息输入的密码码正确32属性DisplayModeEnabledShowMessageBoxValidationSummary控件2-1显示窗体中中生成的所所有错误的的摘要摘要可以按多多种模式显示示：列表、项项目列表或单单独一段将所有其他验验证控件放入入窗体在窗体中