第4章ASP.NET服务器控件和客户端脚本课件

上传人:1ta3****9ta1 文档编号:241298408 上传时间:2024-06-16 格式:PPT 页数:85 大小:1.13MB
返回 下载 相关 举报
第4章ASP.NET服务器控件和客户端脚本课件_第1页
第1页 / 共85页
第4章ASP.NET服务器控件和客户端脚本课件_第2页
第2页 / 共85页
第4章ASP.NET服务器控件和客户端脚本课件_第3页
第3页 / 共85页
点击查看更多>>
资源描述
第第4章章ASP.NET服务器控件和客户端脚本服务器控件和客户端脚本4.1控件概述控件概述4.2HTML服务器控件服务器控件4.3标准控件标准控件4.4验证控件验证控件4.5用户控件与自定义服务器控件用户控件与自定义服务器控件4.6用用JavaScript处理页面和服务器控件处理页面和服务器控件4.7客户端回调客户端回调4.8文件的上传和邮件发送文件的上传和邮件发送4.9综合应用综合应用第4章ASP.NET服务器控件和客户端脚本4.1控件14.1控件概述控件概述HTML服服务器控件器控件n公开至服公开至服务器的器的HTML项,控件的,控件的对象模型与相象模型与相对应的的HTML元素有非常密切的关系。元素有非常密切的关系。Web服服务器控件器控件n并不一一并不一一对应至至HTML元素,而是更抽象的控件。元素,而是更抽象的控件。验证控件控件n用来用来检测用用户输入的数据,避免无入的数据,避免无谓的服的服务器器环回。回。用用户控件控件n提供在多个网提供在多个网页中重复使用中重复使用设计好的接口一种方式。好的接口一种方式。自定自定义服服务器控件器控件n可以像拖曳其他可以像拖曳其他Web标准控件那准控件那样方便地使用它。方便地使用它。4.1控件概述HTML服务器控件24.2 HTML服务器控件服务器控件lHTML标记 HTML服务器控件lHTML服务器控件主要特点:l对象模式,服务器执行后将其转译成HTML标记及属性,再发给浏览器l拥有处理客户端script的能力lHTML标记有在浏览器执行的事件(如onclick)lHTML服务器控件则还有在服务器执行的事件(如onserverclick)lHTML服务器控件支持viewstatelHTML服务器控件与验证控件整合应用,达到验证窗体数据的目的lHTML服务器控件支持HTML4.01与CSS(层次样式表)l允许用户自定义属性l l Runat=“server”Id=“”4.2 HTML服务器控件HTML标记 3System.Web.UI.HTMLControl名称空间的结构名称空间的结构 HtmlContainerControlHtmlContainerControl HtmlImageHtmlImage HtmlInputControlHtmlInputControl HtHtmlAnchormlAnchor HtmlButtonHtmlButton HtmlFormHtmlForm HtmlGenericControlHtmlGenericControl HtmlSelectHtmlSelect HtmlTableHtmlTable HtmlTableRowHtmlTableRow HtmlTableCellHtmlTableCell HtmlTextAreaHtmlTextArea HtmlInputButtonHtmlInputButton HtmlInputCheckBoxHtmlInputCheckBox HtmlInputHtmlInputFileFileHtmlInputHiddenHtmlInputHidden HtmlInputImageHtmlInputImage HtmlInputRadioButtonHtmlInputRadioButton HtmlInputTextHtmlInputText HtmlControlHtmlControlIddisabledVisibleTagNameInnerHtmlInnerTextTypeValueServerClickServerChangeSystem.Web.UI.HTMLControl名称空间的4HTML服务器控件与服务器控件与HTML标记的对应表示标记的对应表示HTML服务器控件与HTML标记的对应表示5HTML服务器控件的应用服务器控件的应用【例4.1】使用HTML服务器控件完成一个表单,实现简单的用户登录和提交留言。服务器端编程获取用户所填写的内容并输出。页面设计:页面中放置两个文本框(User(ID值)用于输入用户名、Password用于输入密码),两个多行文本框(messeage用于显示登录或留言信息、comment用于输入留言信息),两个按钮(BtnLogin表示登录单击的“确定”、BtnOK表示发表留言的“提交”)。网页界面如图4.3所示。前台文件example4-1.aspx实现表单的页面部分,后台文件example4-1.aspx.cs实现事件代码处理部分。图4.3example4-1的界面HTML服务器控件的应用【例4.1】使用HTML服务器控6HTML服务器控件的应用服务器控件的应用本例网页example4-1.aspx页面代码。页面后台example4-1.aspx.cs文件的代码。按钮BtnLogin的单击事件BtnLogin_ServerClick用于判断用户是否输入正确的用户名和密码。如果正确登录,则在多行文本框message中显示“成功登录系统”,否则显示“用户名或密码错误”。按钮BtnOK的服务器端单击事件为BtnOK_ServerClick,用来接受多行文本框comment的信息,并显示在message中。程序运行结果如图4.4所示。图4.4例4.1运行结果HTML服务器控件的应用本例网页example4-1.asp74.3 Web服务器控件服务器控件l以开头,结尾l拥有更多功能与特殊目的的控件,(如calendar、AdRotator)l具有更丰富的对象,提供类型安全程序设计功能l与浏览器无关l部分控件可以通过使用模板自定义输出结果(如Repeater、Datalist及GridView控件l部分控件可以指定在数据或选取项改变时,将数据返回至服务器,无须等待浏览器执行发送的操作,如DropDownList控件l除了少数的HTML服务器控件外,可以完全代替HTML服务器控件。l声明举例:ll4.3 Web服务器控件以开头,/Asp8Web服务器控件的层次结构服务器控件的层次结构Web服务器控件的层次结构9Web服务器控件服务器控件标准控件标准控件l基本控件lLabel、Literal、TextBoxlButton、LinkButton、ImageButtonlCheckBox、CheckBoxList,RadioButton、RadioButtonList,ListBox、DropDownListlHyperLinklTablel增强控件(多信息控件)lCalendar,AdRotator,XML,MultiView、View,Image、ImageMap,Wizard Web服务器控件标准控件基本控件10相关概念相关概念l环回l每项需要处理的动作必须由窗体传送给服务器处理,然后再返回给浏览器。这一过程叫“环回(Round Trip)”或“往返行程.l重建网页l每一次环回都会使得网页重新生成。网页是无状态的,即网页变量与控件的数据值并不会保留在服务器上。l内部事件集l服务器控件提供一组有限的内部事件集,并且仅限于鼠标按键类型的事件。l不要触发那些经常会发生的事件(onmouseover)l事件参数l所有事件都会传递两个参数,第一个参数内含与事件相关信息的事件对象(object sender),第二个参数是事件类型相关的参数信息(EventArgs e)l回传与非回传事件l发生在服务器控件中的变动事件会被捕捉,但是不会立即被提交。相关概念环回11Web页面请求及服务器响应的过程页面请求及服务器响应的过程Web页面请求及服务器响应的过程124.3标准控件标准控件h1服务器控件的基本语法服务器控件的基本语法ASP.NET服务器控件的基本语法格式如下:下面的关于某个TextBox控件的两种不同的写法是等价的:请输入姓名:h2服务器控件的属性服务器控件的属性3服务器控件的事件服务器控件的事件4.3标准控件1服务器控件的基本语法13例:注册表单例:注册表单例:注册表单144.3.1输入与显示控件输入与显示控件h1TextBox控件控件TextBox控件是用得最多的控件之一,该控件显示为文本框,可以用来显示数据或者输入数据。TextBox控件定义的语法示例如下:属性属性/事件事件/方法方法说说明明AutoPostBack指示在输入信息时,数据是否实时自动回发到服务器指示在输入信息时,数据是否实时自动回发到服务器AutoCompleteType记忆客户端输入的内容类型(控制控件的自动完成功能)记忆客户端输入的内容类型(控制控件的自动完成功能)MaxLength文本框中最多允许的字符数文本框中最多允许的字符数ReadOnly指示能否更改指示能否更改TextBox控件的内容控件的内容Rows多行文本框中显示的行数多行文本框中显示的行数TextTextBox控件的文本内容控件的文本内容TextModeTextBox控件的行为模式(单行、多行或密码)控件的行为模式(单行、多行或密码)Wrap指示多行文本框内的文本内容是否换行指示多行文本框内的文本内容是否换行TextChanged文本框的内容改变时发生的事件文本框的内容改变时发生的事件Focus()使光标置于文本框中的方法使光标置于文本框中的方法表4.5 TextBox控件的常用属性、事件和方法4.3.1输入与显示控件1TextBox控件属性/事件15h2Label控件控件Label控件用于在Web页面上显示文本。其控件定义的语法示例如下:属性属性说说明明runat规规定定该该控控件件是是一一个个服服务务器器控控件件。必必须须设设置为置为serverText在在label中显示的文本中显示的文本AccessKey指定热键的按键指定热键的按键AssociatedControlID将将Label控控件件与与窗窗体体中中另另一一个个服服务务器器控控件关联起来件关联起来表4.6 Label控件的常用属性2Label控件属性说明runat规定该控件是一个服务16h3Literal控件控件Literal控件的工作方式类似于Label控件。用于在浏览器上显示在整个过程中不发生变化的文本。其控件定义的语法示例如下:。属属性性说说明明Text规定要显示的文本规定要显示的文本Mode指定控件对所添加的标记的处理方式指定控件对所添加的标记的处理方式表4.7 Literal控件的常用属性3Literal控件属性说明Text规定要174.3.2按钮控件按钮控件h1Button控件控件h2LinkButton控件控件h3ImageButton控件控件作用:提交页面相关事件:(1)Page_load事件(2)Click事件。4.3.2按钮控件1Button控件18属性属性/事件事件/方法方法说说明明Attributes获取控件的属性集合获取控件的属性集合BackColor获取或设置背景色获取或设置背景色BordorColor获取或设置边框颜色获取或设置边框颜色CommandArgument获获取取或或设设置置可可选选参参数数,该该参参数数与与CommandName一一起传递到起传递到Command事件事件CommandName获获取取或或设设置置命命令令名名,该该命命令令名名与与传传递递给给Command事事件的件的Button控件相关联控件相关联EnableViewState获获取取或或设设置置一一个个值值,指指示示服服务务器器控控件件是是否否保保持持自自己己及所包含子控件的状态及所包含子控件的状态PostBackUrl获获取取或或设设置置单单击击Button时时从从当当前前页页发发送送到到的的网网页页的的URL。默认为空,即本页。默认为空,即本页Text获取或设置在获取或设置在Button控件中显示的文本标题控件中显示的文本标题Click在单击在单击Button控件时发生的服务器端事件控件时发生的服务器端事件OnClientClick在单击在单击Button控件时发生的客户端事件控件时发生的客户端事件Command在单击在单击Button控件时发生的服务器端事件控件时发生的服务器端事件表4.8 Button控件的常用属性、事件和方法属性/事件/方法说明Attributes获取控件的属性集194.3.3选择和列表控件选择和列表控件(webcontrol1)h1RadioButton控件控件【例4.2】页面上的一组RadioButton控件可以定义如下:属性属性/事件事件说说明明Checked布尔值,规定是否选定单选按钮布尔值,规定是否选定单选按钮AutoPostBack布布尔尔值值,规规定定在在Checked属属性性被被改改变变后后,是是否否立立即回传表单。默认是即回传表单。默认是falseGroupName该单选按钮所属控件组的名称该单选按钮所属控件组的名称OnCheckedChanged当当Checked被改变时,被执行的函数的名称被改变时,被执行的函数的名称Text单选按钮旁边的文本单选按钮旁边的文本TextAlign文本应出现在单选按钮的哪一侧(左侧还是右侧)文本应出现在单选按钮的哪一侧(左侧还是右侧)表4.10 RadioButton控件的常用属性和事件4.3.3选择和列表控件(webcontrol1)1R20h2RadioButtonList控件控件RadioButton控件优于RadioButtonList控件的一个方面是,可以在RadioButton控件之间放置其他项(文本、控件或图像)。虽然多个RadioButton控件也可以组成单选按钮组以实现互斥选择,但有多个选项供用户进行选择时,使用RadioButtonList控件更加方便。RadioButtonList控件定义示例如下,男女保密2RadioButtonList控件21属性属性/事件事件说说明明AutoPostBack指指示示当当用用户户改改变变选选项项时时该该控控件件是是否否自自动动地地回回发发到到服服务器务器DataMemberDataSource中要绑定的表名中要绑定的表名DataSource填充该列表的列表项的数据源填充该列表的列表项的数据源DataSourceID提供数据的数据源组件的提供数据的数据源组件的IDDataTextField提供列表项的文本的数据源字段的名称提供列表项的文本的数据源字段的名称DataTextFormatString用来控制列表项的显示方式的格式化字符串用来控制列表项的显示方式的格式化字符串DataValueField提供一个列表项的值的数据源字段的名称提供一个列表项的值的数据源字段的名称Items获得列表控件中的项目集合获得列表控件中的项目集合RepeatColumns获得或设置控件中要显示的列数获得或设置控件中要显示的列数RepeatDirection获获得得或或设设置置一一个个指指示示该该控控件件垂垂直直显显示示还还是是水水平平显显示示的值的值RepeatLayout获得或设置单选按钮(表或流)的布局获得或设置单选按钮(表或流)的布局SelectedIndex获获得得或或设设置置列列表表中中第第一一个个被被选选项项的的索索引引即即索索引引最最小小的项的项SelectedItem获得第一个被选项获得第一个被选项SelectedValue获得第一个被选项的值获得第一个被选项的值TextAlign获得或设置单选按钮的文本对齐方式获得或设置单选按钮的文本对齐方式SelectedIndexChanged当在当在RadioButtonList中改变选择时触发的事件中改变选择时触发的事件表4.11 RadioButtonList控件的常用属性和事件属性/事件说明AutoPostBack指示当用户改变选项22RadioButtonList控件的Items集合的成员和列表中的每一项对应,要确定选中了哪些项,应测试每项的Selected属性。ListItem的基本属性如表4.12所示。属性属性/事件事件说说明明Text每个选项的文本每个选项的文本Value每个选项的值每个选项的值Selected选选项项的的状状态态,Ture表表示示默默认认选中选中表4.12 ListItem的基本属性RadioButtonList控件的Items集合的成员和列23h3CheckBox控件控件CheckBox控件定义示例如下:属性属性/事件事件说明说明Checked布尔值,规定是否选定单选按钮布尔值,规定是否选定单选按钮AutoPostBack布布尔尔值值,规规定定在在Checked属属性性被被改改变变后后,是否立即回传表单。默认是是否立即回传表单。默认是falseOnCheckedChanged当当Checked被被改改变变时时,被被执执行行的的函函数数的的名名称称TextCheckBox控件旁边的文本控件旁边的文本TextAlign文文本本应应出出现现在在CheckBox的的哪哪一一侧侧(左左侧侧还还是右侧)是右侧)3CheckBox控件属性/事件说明Checked布尔值24h4CheckBoxList控件控件【例4.3】CheckBoxList控件定义如下:琴棋 书 画CheckBoxList控件的SelectedIndexChanged事件。4CheckBoxList控件【例4.3】25h5DropDownList控件控件【例4.4】DropDownList控件在Web页面上呈现为下拉列表框,它允许用户从预定义的多个选项中选择一项。在选择前,用户只能看到第一个选项,其余的选项都“隐藏”起来。通过设置该控件的高度和宽度(以像素为单位),可以设定控件的大小,但是不能控制该列表拉下时显示的项目数。DropDownList控件定义示例如下:您的学历:博士 硕士本科5DropDownList控件【例4.4】26属性属性/事件事件说明说明AutoPostBack指指示示当当用用户户改改变变选选项项时时该该控控件件是是否否应应当当自自动动地地回回发发到到服务器服务器DataMemberDataSource中要绑定的表的名称中要绑定的表的名称DataSource填充该列表的项目的数据源填充该列表的项目的数据源DataSourceID提供数据的数据源组件的提供数据的数据源组件的IDDataTextField提供列表的文本的数据源字段的名称提供列表的文本的数据源字段的名称DataTextFormatString用来控制列表项的显示方式的格式化字符串用来控制列表项的显示方式的格式化字符串DataValueField提供一个列表项的值的数据源字段的名称提供一个列表项的值的数据源字段的名称Items获得列表控件中的项目集合获得列表控件中的项目集合SelectedIndex获得或设置列表中被选项的索引获得或设置列表中被选项的索引SelectedItem获得列表中的被选项获得列表中的被选项SelectedValue获得列表中被选项的值获得列表中被选项的值SelectedIndexChanged当列表控件的选择项发生变化时触发当列表控件的选择项发生变化时触发表4.14 DropDownList控件的常用属性和事件属性/事件说明AutoPostBack指示当用户改变选项时27h6ListBox控件控件【例4.5】ListBox控件定义示例如下:身份:已工作 大学生 中学生/中专技校 以上都不是ListBox控件的SelectedIndexChanged事件。6ListBox控件【例4.5】287BulletedList控件控件以下是一个BulletedList控件的定义示例:第一项第二项7BulletedList控件以下是一个BulletedL29属属性性说说明明BulletImageUrl获得或设置到用做项目符号的图像的路径获得或设置到用做项目符号的图像的路径BulletStyle确定项目符号的样式确定项目符号的样式DataMemberDataSource中要绑定的表的名称中要绑定的表的名称DataSource用来填充该列表控件的列表项的数据源用来填充该列表控件的列表项的数据源DataSourceID提供数据的数据源组件的提供数据的数据源组件的IDDataTextField提供列表项的文本的数据源字段的名称提供列表项的文本的数据源字段的名称DataTextFormatString用来控制列表项显示样式的格式化字符串用来控制列表项显示样式的格式化字符串DataValueField提供列表项的值的数据源字段的名称提供列表项的值的数据源字段的名称DisplayMode确定如何显示列表项:纯文本、链接按钮或超链接确定如何显示列表项:纯文本、链接按钮或超链接FirstBulletNumber获得或设置编号的起始值获得或设置编号的起始值Items获得列表控件中的列表项的集合获得列表控件中的列表项的集合Target指示超链接模式下的目标框架指示超链接模式下的目标框架表4.15 BulletedList控件的属性属性说明BulletImageUrl获得或设置到用做30枚枚举举值值说说明明Circle表示项目符号编号样式设置为表示项目符号编号样式设置为“”空圈空圈CustomImage编编号号样样式式设设置置为为自自定定义义图图片片,图图片片由由BulletImageUrl属性指定属性指定Disc编号样式设置为编号样式设置为“”实圈实圈LowerAlpha编编号号样样式式设设置置为为小小写写字字母母格格式式,如如a、b、c、d等等LowerRoman编编号号样样式式设设置置为为小小写写罗罗马马数数字字格格式式,如如i、ii、iii、iv等等NotSet表示不设置项目符号编号样式表示不设置项目符号编号样式Numbered编号样式为数字格式,如编号样式为数字格式,如1、2、3、4等等Square编号样式为编号样式为“”实体黑方块实体黑方块UpperAlpha编编号号样样式式为为大大写写字字母母格格式式,如如A、B、C、D等等UpperRoman编编号号样样式式为为大大写写罗罗马马数数字字格格式式,如如I、II、III、IV等等表4.16 BulletStyle枚举值列表枚举值说明Circle表示项目符号编号样式设置为“314.3.4HyperLink控件控件HyperLink服务器控件在Web页上创建超级链接,使用户可以在应用程序中的页之间移动跳转到其他页面,相当于HTML中的元素。HyperLink控件定义的语法格式如下:网站服务条款此行代码定义一个超级链接。表4.17列出了HyperLink控件的常用属性。属属性性说说明明ImageUrl显示此链接的图像的显示此链接的图像的URLNavigateUrl该该链链接接的的目目标标URL,当当用用户户单单击击链链接接时时会会转向此转向此URLTargetURLURL的的目目标标框框架架,默默认认为为本本框框架架,_blank表表示新窗口示新窗口Text显示该链接的文本显示该链接的文本表4.17 HyperLink控件的常用属性4.3.4HyperLink控件HyperLink服务器324.3.5Table控件控件 对对象象成成员员功功能能TableBackImageUrlCaptionCaptionAlignCellPaddingCellSpacingRows表格的背景图像的表格的背景图像的URL表格的标题表格的标题标题文本的对齐方式标题文本的对齐方式Table中中单单元元格格内内容容和和单单元元格格边边框框之之间间的的空空间间量量(单位:像素)(单位:像素)Table控控件件中中相相邻邻单单元元格格之之间间的的空空间间量量(以以像像素素为为单位)单位)Table控件中行的集合控件中行的集合TableRowHorizontalAlighVerticalAlighCells获取或设置行内容的水平对齐方式获取或设置行内容的水平对齐方式获取或设置行内容的垂直对齐方式获取或设置行内容的垂直对齐方式获获取取TableCell对对象象的的集集合合,这这些些对对象象表表示示Table控控件中的行的单元格件中的行的单元格TableCellColumnSpanRowSpanText获取或设置该单元格在获取或设置该单元格在Table跨越的列数跨越的列数获取或设置获取或设置Table控件中单元格跨越的行数控件中单元格跨越的行数获取或设置单元格的文本内容获取或设置单元格的文本内容4.3.5Table控件asp:Tableid=T33动态地创建一个Table包含三个步骤:【例4.6】(1)创建TableRow对象以表示表中的行。(2)创建TableCell对象,表示行中的单元格,并将单元格添加到行中。(3)将TableRow添加到Table控件的Rows集合中。动态地创建一个Table包含三个步骤:【例4.6】34l声明语法:llAdvertisementFile:获取或设置包含广告信息的XML广告调度文件的相对或绝对地址lTarget:广告所链接的网页在哪个框架或窗口打开_self/_blank/_parent/_toplOnAdCreated:在AdRotator控件创建后,网页提交前会触发此事件,其参数为AdCreatedEventArgslAdCreatedEventArgs的属性lAdProperties:目前显示的广告的相关信息lAlternateText:显示广告的替换文本lImageUrl:目前广告的图片源地址lNavigateUrl:会把用户定向到哪个网址lImpressions:广告的重要等级lKeyWords:广告的类4.3.6 AdRotator控件控件声明语法:4.3.6 AdRotator控件35可扩展标记语言可扩展标记语言XMLl可扩展标记语言XML(eXtensibleMarkup Language)是W3C组织于1998年2月发布的标准lXML专门用来描述文本的结构,而不是用来描述如何显示文本;lXML没有一套固定的标记;lXML区分大小写;lXML文档分层嵌套形成一棵标记树,只有根标记,每个元素由一个开始标记和一个结束标记组成,所有属性必须用引号表示。可扩展标记语言XML可扩展标记语言XML(eXtensibl36标标签签说说明明Advertisements包含整个广告文件包含整个广告文件Ad描述每一个单独的广告描述每一个单独的广告ImageUrl要显示的图像的要显示的图像的URL。必需。必需NavigateUrl单击该控件时定位到的单击该控件时定位到的URLAlternateText图图像像不不可可用用时时要要显显示示的的文文本本。在在某某些些浏浏览览器器中中,该该文本显示为工具提示文本显示为工具提示Keyword广广告告类类别别。该该关关键键字字可可用用于于通通过过设设置置KeywordFilter属性过滤要显示的广告属性过滤要显示的广告Impressions一一个个值值,指指示示相相对对于于XML文文件件中中的的其其他他广广告告,该该广广告显示的频率告显示的频率表4.21 在广告文件中使用的XML标签标签说明Advertisements包含整个广告文件37下面是一个下面是一个XML广告文件广告文件ad.xml的例子:的例子:【例4.7】/image/phei.png http:/ 门户门户 20 /image/sohu.gif http:/ 搜狐搜狐 门户门户 80 /image/njnu.jpg http:/ 南京师范大学南京师范大学 大学大学 50 下面是一个XML广告文件ad.xml的例子:【例4.7】384.3.7Calendar控件控件主要功能:(1)显示一个日历,该日历会显示一个月份。)显示一个日历,该日历会显示一个月份。(2)允许用户选择日期、周、月。)允许用户选择日期、周、月。(3)允许用户选择一定范围内的日期。)允许用户选择一定范围内的日期。(4)允许用户移到下一月或上一月。)允许用户移到下一月或上一月。(5)以编程方式控件选定日期的显示。)以编程方式控件选定日期的显示。Calendar控件的最简单形式如下:图4.15Calendar控件4.3.7Calendar控件主要功能:图4.15C391在在Calendar控件中选择日期控件中选择日期【例4.8】Calendar控件有4种日期获取模式,用户可以选择一天、一周或一个月。通过设置控件的SelectionMode属性来实现。模模式式说说明明Day允许用户选择单个日期。这是默认值允许用户选择单个日期。这是默认值DayWeek允许用户选择单个日期或整周允许用户选择单个日期或整周DayWeekMonth允许用户选择单个日期、周或整个月允许用户选择单个日期、周或整个月None不能选择日期不能选择日期表4.23 Calendar控件的SelectionMode属性1在Calendar控件中选择日期【例4.8】模式说40h2控制控制Calendar控件的外观控件的外观许多TableItemStyle类型的属性用于控制日历每个部分的样式。名名称称所设置样式的对象所设置样式的对象DayHeaderStyle一周中某天一周中某天DayStyle日期日期NextPrevStyle月份导航控件月份导航控件OtherMonthDayStyle不在当前显示月份中的日期不在当前显示月份中的日期SelectedDayStyle选中日期选中日期SelectorStyle周和月选择器列周和月选择器列TitleStyle标题栏标题栏TodayDayStyle今天的日期今天的日期WeekendDayStyle周末日期周末日期表4.24 Calendar中TableItemStyle类型的属性2控制Calendar控件的外观名称所设置样式的对象Da41除TableItemStyle类型的属性,还有几个可读写的Boolean类型属性,它们也用于控制日历的外观,属属性性默认值默认值控制其可见性的对象控制其可见性的对象ShowDayHeadertrue一周中每一天的名称一周中每一天的名称ShowGridLinesfalse月份中日期的网格线月份中日期的网格线ShowNextPrevMonthtrue月份导航控件月份导航控件ShowTitletrue标题栏标题栏表4.25 Boolean 类型的属性除TableItemStyle类型的属性,还有几个可读写的B42Calendar控件示例控件示例ToDayDayStyleSelectedDayStyleWeekendDayStyleDayStyleOtherMonthDayStyleTitleStyleNextPrevStyleSelectMonthText属性SelectWeekText属性DayHeaderStyleCalendar控件示例ToDayDayStyleSelec43h3Calendar控件编程控件编程【例4.9】(1)SelectionChanged事件。当用户在Calender控件中选择一天、一周或整个月份时,将触发SelectionChanged事件。以编程方式选择时,并不触发该事件。该事件处理程序传递一个EventArgs类型参数。前面在例4.9中,已经给出此事件的示例。(2)DayRender事件。Calendar控件不直接支持日期绑定,但可以修改单个日期单元格的内容和格式。这样可从数据库中获取数据,以便进行一些处理后把它们置于指定的单元格中。在在Calendar控件呈现到客户端浏览器之前,将组成创建该控件的所控件呈现到客户端浏览器之前,将组成创建该控件的所有组件。随着创建每个单元格,将引发有组件。随着创建每个单元格,将引发DayRender事件。可以捕获该事件。可以捕获该事件。事件。DayRender事件处理程序接收两个DayRenderEventArgs类型的参数。该对象有两个属性,它们可以用编程方式读取。Cell:表示要呈现的单元格的表格单元格对象。Day:表示呈现在单元格中日期的CalendarDay对象。(3)VisibleMonthChanged事件。Calendar控件还提供了一个事件VisibleMonthChanged以确定用户是否更改了月份。3Calendar控件编程【例4.9】44图4.18在Calendar控件中自定义特别日图4.18在Calendar控件中自定义特别日454.3.8Image和和ImageMap控件控件h1Image控件控件图像服务器控件Image可以在Web窗体页上显示图像,并用服务器端的代码管理这些图像。Image控件定义格式如下:Image控件有下列常见属性:(1)AlternateText:为图像提供替代文本(辅助功能要求)。(2)DescriptionUrl:用于提供指向包含该图像详细描述的页面的链接(复杂的图像要求可访问)。(3)GenerateEmptyAlternateText:为AlternateText属性设空字符串值。(4)ImageAlign:用于将图像和页面中其他HTML元素对齐。可能的值有AbsBottom、AbsMiddle、Baseline、Bottom、Left、Middle、NotSet、Right、TextTop和Top。(5)ImageUrl:用于指定图片的URL。4.3.8Image和ImageMap控件1Image46h2ImageMap控件控件ImageMap控件定义格式如下:ImageMap控件的主要属性包括如下。(1)HotSpotMode:热点模式,取值为枚举System.Web.UI.WebControls.HotSpotMode,值如表4.26所示。枚枚举举值值说说明明NotSet未未设设置置。虽虽然然名名为为未未设设置置,但但默默认认情情况况下下会会执执行行定定向向操操作作,定定向向到到指指定定的的URL地地址址。如如果果未未指指定定URL地地址址,将将定定向向到到Web应用程序根目录应用程序根目录Navigate定定向向操操作作。定定向向到到指指定定的的URL地地址址。如如果果未未指指定定URL地地址,默认将定向到址,默认将定向到Web应用程序根目录应用程序根目录PostBack回发操作。单击热点区域后,将执行回发操作。单击热点区域后,将执行Click事件事件Inactive无无任任何何操操作作,即即此此时时ImageMap如如同同一一张张没没有有热热点点区区域域的的普通图片普通图片表4.26 HotSpotMode枚举值【例4.10】2ImageMap控件枚举值说明NotSet未设47(2)HotSpots:该属性对应System.Web.UI.WebControls.HotSpot对象集合。HotSpot类是一个抽象类,有CircleHotSpot(圆形热区)、RectangleHotSpot(方形热区)、PolygonHotSpot(多边形热区)3个子类。实际应用中,可以使用上面3种类型来定制图片的热点区域的形状。(3)AccessKey:用于指定导向ImageMap控件的键。(4)AlternateText:为图像提供替代文本(辅助功能要求)。(5)DescriptionUrl:用于提供指向一个页面的链接,该页面包含对该图像的详细描述(复杂的图像要求能被理解)。(6)GenerateEmptyAlternateText:为AlternateText属性设空字符串值。(7)ImageAlign:用于和页面中其他HTML元素对齐。可能的值有AbsBottom、AbsMiddle、Baseline、Bottom、Left、Middle、NotSet、Right、TextTop和Top。(8)ImageUrl:用于指定图像的URL。(9)TabIndex:设置ImageMap控件的Tab顺序。(10)Target:用于在新窗口中打开页面。ImageMap控件支持Click事件,在用户对热点区域单击时触发,通常在HotSpotMode为PostBack时用到。(2)HotSpots:该属性对应System.Web.UI484.3.9MultiView和和View控件控件【例4.11】View控件是视图控件,MultiView控件是多视图控件,两者都属于容器控件,View控件是一个Web控件的容器,而MultiView控件又是View控件的容器,因此两者一般一起搭配运作。在MultiView控件中可以拖曳多个View控件,而View控件内包含了任何需要显示在页面中的内容,存放一般ASP.NET服务器控件的,如Image、TextBox等。虽然MultiView中可包含多个View控件,但页面一次只能显示一个视图,因此也只有一个View控件区域会被显示。MultiView通过ActiveViewIndex属性值来决定哪个View要被显示,程序也是利用ActiveViewIndex属性设置来切换不同的View4.3.9MultiView和View控件【例4.11】49View和MultiView控件格式如下:View和MultiView控件继承自System.Web.UI.Control类。MultiView控件有一个类型为ViewCollection的只读属性View。使用该属性可获得包含在MultiView中的View对象集合。与所有的.NET集合一样,该集合中的元素被编入索引。MultiView控件包含ActiveViewIndex属性,该属性可获取或设置以0开始的,当前活动视图的索引。View和MultiView控件格式如下:50表4.27列出了MultiView控件的4个CommandName字段。为按钮的CommandName属性赋值,能够实现视图导航。例如,将Button、ImageButton或LinkButton控件的CommandName属性设置为NextView,单击这些按钮后将自动导航到下一个视图,而不需要额外的代码。开发者不需要为按钮编写单击事件处理程序。字字段段默认命令默认命令名名说说明明NextViewCommandNameNextView导导 航航 到到 下下 一一 个个 具具 有有 更更 高高ActiveViewIndex值值的的视视图图。如如果果当当前前位位于于最最后后的的视视图图,则则设设置置Active-ViewIndex为为-1,不不显显示示任何视图任何视图PreviousViewCommandNamePrevView导导航航到到低低于于ActiveVie-wIndex值值的的视视图图。如如果果当当前前位位于于第第一一个个视视图图,则则设设置置ActiveViewIndex为为-1,不显示任何视图,不显示任何视图SwitchViewByIDCommandNameSwitchViewByID导导航航到到指指定定ID的的视视图图,可可以以使使用用CommandArgument指指定定ID值值SwitchViewByIndexCommandNameSwitchViewByIndex导导航航到到指指定定索索引引的的视视图图,使使用用CommandArgument属属性性指指定定索索引引表4.27 MultiView控件的CommandName字段表4.27列出了MultiView控件的4个CommandN514.3.10Wizard控件控件【例4.12】(1)收集多个步骤中的相关信息。(2)用于收集用户输入的大型Web网页可分割成较小的逻辑步骤。(3)允许线性或非线性地导航各个步骤。Wizard控件可以提供良好的流程导航与步骤指引,让用户很明确地知道有哪些步骤,并可建立程序化逻辑来处理或控制比较复杂的步骤。Wizard控件可区分成4大区域。(1)向导步骤(WizardStep)区域:Wizard控件使用多个步骤来描绘用户输入的不同部分。每个步骤的内容添加在标记中,所有的又都包含在标记中。实际应用时,每次只能显示一个定义的内容。(2)标题(Header)区域:用于在步骤顶部提供一致的信息,此项是可选元素。(3)侧栏(SideBar)区域:此项也是可选元素,通常显示在向导左边,包含所有步骤的列表,并提供在各个步骤间的跳转。(4)导航按钮(Navigation)区域:是Wizard内置导航功能,它会根据步骤类型(StepType)设置值的不同,而呈现不同的导航按钮。4.3.10Wizard控件【例4.12】(1)收集多个52每个WizardStep步骤都会有个StepType属性,它最主要的作用是决定每个步骤中的导航Button按钮会如何被显示,StepType的类型说明如表4.28所示。StepType类类型型说说明明Start(开开始始步骤)步骤)这是第一个开始步骤,只会呈现这是第一个开始步骤,只会呈现【下一步下一步】按钮按钮Step(阶阶 段段步骤)步骤)在在Start及及Finish之之间间的的步步骤骤全全部部归归类类为为Step,Step会同时呈现会同时呈现【上一步上一步】及及【下一步下一步】按钮按钮Finish(完完成步骤)成步骤)这这是是最最后后的的数数据据收收集集步步骤骤,会会呈呈现现【完完成成】及及【上上一一步步】按按钮钮,但但若若前前一一个个步步骤骤的的AllowReturn设设置置为为False,则不显示,则不显示【上一步上一步】按钮按钮Complete(结束步骤)(结束步骤)这这是是Wizard的的最最后后一一个个步步骤骤画画面面,完完全全不不会会呈呈现现任任何何按按钮钮,甚甚至至连连SideBar区区域域也也会会消消失失;若若就就英英文文字字面面很很难难区区分分Complete和和Finish两两者者的的差差别别,但但就就实实质而言,质而言,Complete较贴近最后的结束较贴近最后的结束Auto(自动)(自动)系系统统会会依依该该步步骤骤的的顺顺序序决决定定其其为为何何种种StepType类类型型表4.28 StepType类型每个WizardStep步骤都会有个StepType属性,它53Wizard控件的所有外观特征几乎都可以通过样式和模板来自定义,包括各种各样的按钮和链接、标题和页脚、工具条和WizardStep。Wizard向导控件所支持的样式如表4.29所示。样式(样式(Style)说说明明CancelButtonStyle设置设置【取消取消】按钮的样式按钮的样式FinishCompleteButtonStyle设置设置【完成完成】按钮的样式按钮的样式FinishPreviousButtonStyle设设置置Finish步步骤骤中中的的【上上一一步步】按按钮钮的的样式样式HeaderStyle设置表头样式设置表头样式NavigationButtonStyle设置导航区域中所有按钮的样式设置导航区域中所有按钮的样式NavigateStyle设置导航区域样式设置导航区域样式SideBarStyle设置设置SideBar区域样式区域样式StartNextButtonStyle设设置置Start步步骤骤中中的的【下下一一步步】按按钮钮的的样样式式StepNextButtonStyle设设置置Step步步骤骤中中的的【下下一一步步】按按钮钮的的样样式式StepPreviousButtonStyle设设置置Step步步骤骤中中的的【上上一一步步】按按钮钮的的样样式式StepStyle设置设置WizardStep区域的样式区域的样式表4.29 Wizard控件样式设置表Wizard 控件的所有外观特征几乎都可以通过样式和模板来自定54Wizard控件除了可调整样式外,还可调整其外观属性,如果您想更进一步定制Wizard控件默认的样式或外观等,可以通过其模板编辑功能来达成深入的定制,Wizard控件提供了5种模板编辑,如表4.30所示。模板类型(模板类型(Template)说说明明HeaderTemplate编辑表头模板编辑表头模板SideBarTemplate编辑编辑SideBar模板模板StartNavigationTemplate编辑开始步骤导航区域模板编辑开始步骤导航区域模板StepNavigationTemplate编辑阶段编辑阶段Step步骤导航区域模板步骤导航区域模板FinishNavigationTemplate编辑完成步骤导航区域模板编辑完成步骤导航区域模板表4.30 Wizard控件模板类型Wizard 控件除了可调整样式外,还可调整其外观属性,如果您55Wizard控件的属性非常多,表4.31列出了常用属性。属属性性说说明明ActiveStepIndex通通过过索索引引值值设设置置WizardSteps集集合合中中哪哪个个步骤项为步骤项为ActiveCancelDestinationPageUrl设设置置当当用用户户按按下下【取取消消】按按钮钮时时会会导导向向到的网页到的网页URLDisplayCancelButton是是否否显显示示【取取消消】按按钮钮,默默认认不不显显示示(False)DisplaySideBar是否显示是否显示SideBar区域,默认为区域,默认为TrueEnableTheme是否套用是否套用ThemeFinishDestinationPageUrl设设置置当当用用户户按按下下【完完成成】按按钮钮时时会会重重新新导向到的网页导向到的网页URLSkinID取得或设置要套用至控件的面板取得或设置要套用至控件的面板ToolTip设设置置当当鼠鼠标标指指针针停停留留在在Web服服务务器器控控件件时显示的文字时显示的文字表4.31 Wizard控件的常用属性Wizard 控件的属性非常多,表4.31列出了常用属性。属56Wizard支持的事件如表4.32所示。事事件件说说明明ActiveStepChanged当用户切换至控件中的新步骤时发生当用户切换至控件中的新步骤时发生CancelButtonClick当用户单击当用户单击【取消取消】按钮时发生按钮时发生FinishButtonClick当用户单击当用户单击【完成完成】按钮时发生按钮时发生NextButtonClick当用户单击当用户单击【下一步下一步】按钮时发生按钮时发生PreviousButtonClick当用户单击当用户单击【上一步上一步】按钮时发生按钮时发生SideBarButtonClick当用户单击当用户单击SideBar区域中的项目时发生区域中的项目时发生表4.32 Wizard支持的事件Wizard 支持的事件如表4.32所示。事件说明Ac57Wizard控件包含3个特别有意思的方法,如表4.33所示。方法名称方法名称返回类型返回类型说说明明GetHistoryICollection返返回回一一个个按按被被访访问问的的顺顺序序排排列列的的WizardStepBase对对象象的的集集合合,索索引引0为为最近访问的步骤最近访问的步骤GetStepTypeWizardStepType步骤的类型,如表步骤的类型,如表4-28所示所示MoveTovoid移动到参数中指定的移动到参数中指定的WizardStep对象对象表4.33 Wizard控件的方法Wizard 控件包含3个特别有意思的方法,如表4.33所示。584.4 验证控件验证控件lASP.NET封装了6个验证控件,能处理常见的验证情况,开发者使用这些验证控件,无需编写代码即可轻松的在页面上实现验证功能。4.4 验证控件ASP.NET封装了6个验证控件,能处理59客户端验证和服务端验证客户端验证和服务端验证对于验证中的事件序列,有两种情况:(1)若客户端支持客户端支持JScript且验证控件的EnableClientScript=true,则在客户端和服务器上执行验证。(2)如果上面两个条件的任何一个不满足,则只在服务器上执行验证。如果在客户端上执行验证,则在被验证的控件丢失焦点时被验证的控件丢失焦点时进行验证。(一般是在单击Submit按钮之前进行该操作)。如果验证失败,则不会发送如果验证失败,则不会发送任何内容给服务器任何内容给服务器,但验证控件将仍然通过使用JavaScript显示关于失败的文本消息。当由服务器接收时,执行另一个验证。如果页面通过验证,则页面继续执行它的其他任务。如果存在失败,则将Page.IsValid设置为False,然后页面执行脚本,但如果程序员检查Page.IsVal
展开阅读全文
相关资源
相关搜索

最新文档


当前位置:首页 > 办公文档 > 教学培训


copyright@ 2023-2025  zhuangpeitu.com 装配图网版权所有   联系电话:18123376007

备案号:ICP2024067431-1 川公网安备51140202000466号


本站为文档C2C交易模式,即用户上传的文档直接被用户下载,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有。装配图网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。若文档所含内容侵犯了您的版权或隐私,请立即通知装配图网,我们立即给予删除!