第4章ASPNET服务器控件和客户端脚本课件.ppt
- 【下载声明】
1. 本站全部试题类文档,若标题没写含答案,则无答案;标题注明含答案的文档,主观题也可能无答案。请谨慎下单,一旦售出,不予退换。
2. 本站全部PPT文档均不含视频和音频,PPT中出现的音频或视频标识(或文字)仅表示流程,实际无音频或视频文件。请谨慎下单,一旦售出,不予退换。
3. 本页资料《第4章ASPNET服务器控件和客户端脚本课件.ppt》由用户(晟晟文业)主动上传,其收益全归该用户。163文库仅提供信息存储空间,仅对该用户上传内容的表现方式做保护处理,对上传内容本身不做任何修改或编辑。 若此文所含内容侵犯了您的版权或隐私,请立即通知163文库(点击联系客服),我们立即给予删除!
4. 请根据预览情况,自愿下载本文。本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
5. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007及以上版本和PDF阅读器,压缩文件请下载最新的WinRAR软件解压。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- ASPNET 服务器 控件 客户端 脚本 课件
- 资源描述:
-
1、第第4章章 ASP.NET服务器控件和客户端脚本服务器控件和客户端脚本4.1 控件概述控件概述4.2 HTML服务器控件服务器控件4.3 标准控件标准控件4.4 验证控件验证控件4.5 用户控件与自定义服务器控件用户控件与自定义服务器控件4.6 用用JavaScript处理页面和服务器控件处理页面和服务器控件4.7 客户端回调客户端回调4.8 文件的上传和邮件发送文件的上传和邮件发送4.9 综合应用综合应用4.1 控件概述控件概述lHTML服务器控件l公开至服务器的HTML项,控件的对象模型与相对应的HTML元素有非常密切的关系。lWeb服务器控件l并不一一对应至HTML元素,而是更抽象的控件
2、。l验证控件l用来检测用户输入的数据,避免无谓的服务器环回。l用户控件l提供在多个网页中重复使用设计好的接口一种方式。l自定义服务器控件l可以像拖曳其他Web标准控件那样方便地使用它。4.2 HTML服务器控件服务器控件lHTML标记 HTML服务器控件lHTML服务器控件主要特点:l对象模式,服务器执行后将其转译成HTML标记及属性,再发给浏览器l拥有处理客户端script的能力lHTML标记有在浏览器执行的事件(如onclick)lHTML服务器控件则还有在服务器执行的事件(如onserverclick)lHTML服务器控件支持viewstatelHTML服务器控件与验证控件整合应用,达到
3、验证窗体数据的目的lHTML服务器控件支持HTML4.01与CSS(层次样式表)l允许用户自定义属性l l Runat=“server”Id=“”System.Web.UI.HTMLControl名称空间的结构名称空间的结构 HtmlContainerControlHtmlContainerControl HtmlImageHtmlImage HtmlInputControlHtmlInputControl HtHtmlAnchormlAnchor HtmlButtonHtmlButton HtmlFormHtmlForm HtmlGenericControlHtmlGenericContro
4、l HtmlSelectHtmlSelect HtmlTableHtmlTable HtmlTableRowHtmlTableRow HtmlTableCellHtmlTableCell HtmlTextAreaHtmlTextArea HtmlInputButtonHtmlInputButton HtmlInputCheckBoxHtmlInputCheckBox HtmlInputHtmlInputFileFileHtmlInputHiddenHtmlInputHidden HtmlInputImageHtmlInputImage HtmlInputRadioButtonHtmlInput
5、RadioButton HtmlInputTextHtmlInputText HtmlControlHtmlControlIddisabledVisibleTagNameInnerHtmlInnerTextTypeValueServerClickServerChangeHTML服务器控件与服务器控件与HTML标记的对应表示标记的对应表示HTML服务器控件的应用服务器控件的应用【例4.1】使用HTML服务器控件完成一个表单,实现简单的用户登录和提交留言。服务器端编程获取用户所填写的内容并输出。页面设计:页面中放置两个文本框(User(ID值)用于输入用户名、Password用于输入密码),两个多
6、行文本框(messeage用于显示登录或留言信息、comment用于输入留言信息),两个按钮(BtnLogin表示登录单击的“确定”、BtnOK表示发表留言的“提交”)。网页界面如图4.3所示。前台文件example4-1.aspx实现表单的页面部分,后台文件example4-1.aspx.cs实现事件代码处理部分。图4.3 example4-1的界面HTML服务器控件的应用服务器控件的应用本例网页example4-1.aspx页面代码。页面后台example4-1.aspx.cs文件的代码。按钮BtnLogin的单击事件BtnLogin_ServerClick用于判断用户是否输入正确的用户名
7、和密码。如果正确登录,则在多行文本框message中显示“成功登录系统”,否则显示“用户名或密码错误”。按钮BtnOK的服务器端单击事件为BtnOK_ServerClick,用来接受多行文本框comment的信息,并显示在message中。程序运行结果如图4.4所示。图4.4 例4.1运行结果4.3 Web服务器控件服务器控件l以开头,结尾l拥有更多功能与特殊目的的控件,(如calendar、AdRotator)l具有更丰富的对象,提供类型安全程序设计功能l与浏览器无关l部分控件可以通过使用模板自定义输出结果(如Repeater、Datalist及GridView控件l部分控件可以指定在数据或
8、选取项改变时,将数据返回至服务器,无须等待浏览器执行发送的操作,如DropDownList控件l除了少数的HTML服务器控件外,可以完全代替HTML服务器控件。l声明举例:llWeb服务器控件的层次结构服务器控件的层次结构Web服务器控件服务器控件标准控件标准控件l基本控件lLabel、Literal、TextBoxlButton、LinkButton、ImageButtonlCheckBox、CheckBoxList,RadioButton、RadioButtonList,ListBox、DropDownListlHyperLinklTablel增强控件(多信息控件)lCalendar,Ad
9、Rotator,XML,MultiView、View,Image、ImageMap,Wizard 相关概念相关概念l环回l每项需要处理的动作必须由窗体传送给服务器处理,然后再返回给浏览器。这一过程叫“环回(Round Trip)”或“往返行程.l重建网页l每一次环回都会使得网页重新生成。网页是无状态的,即网页变量与控件的数据值并不会保留在服务器上。l内部事件集l服务器控件提供一组有限的内部事件集,并且仅限于鼠标按键类型的事件。l不要触发那些经常会发生的事件(onmouseover)l事件参数l所有事件都会传递两个参数,第一个参数内含与事件相关信息的事件对象(object sender),第二个
10、参数是事件类型相关的参数信息(EventArgs e)l回传与非回传事件l发生在服务器控件中的变动事件会被捕捉,但是不会立即被提交。Web页面请求及服务器响应的过程页面请求及服务器响应的过程4.3 标准控件标准控件h 1服务器控件的基本语法服务器控件的基本语法ASP.NET服务器控件的基本语法格式如下:下面的关于某个TextBox控件的两种不同的写法是等价的:请输入姓名:h 2服务器控件的属性服务器控件的属性3服务器控件的事件服务器控件的事件例:注册表单例:注册表单4.3.1 输入与显示控件输入与显示控件h 1TextBox控件控件TextBox控件是用得最多的控件之一,该控件显示为文本框,可
11、以用来显示数据或者输入数据。TextBox控件定义的语法示例如下:属性属性/事件事件/方法方法说说 明明AutoPostBack指示在输入信息时,数据是否实时自动回发到服务器指示在输入信息时,数据是否实时自动回发到服务器AutoCompleteType记忆客户端输入的内容类型(控制控件的自动完成功能)记忆客户端输入的内容类型(控制控件的自动完成功能)MaxLength文本框中最多允许的字符数文本框中最多允许的字符数ReadOnly指示能否更改指示能否更改 TextBox 控件的内容控件的内容Rows多行文本框中显示的行数多行文本框中显示的行数TextTextBox 控件的文本内容控件的文本内容
12、TextModeTextBox 控件的行为模式(单行、多行或密码)控件的行为模式(单行、多行或密码)Wrap指示多行文本框内的文本内容是否换行指示多行文本框内的文本内容是否换行TextChanged文本框的内容改变时发生的事件文本框的内容改变时发生的事件Focus()使光标置于文本框中的方法使光标置于文本框中的方法表4.5 TextBox控件的常用属性、事件和方法h 2Label控件控件Label 控件用于在Web页面上显示文本。其控件定义的语法示例如下:属性属性说说 明明runat规 定 该 控 件 是 一 个 服 务 器 控 件。必 须 设 置 为规 定 该 控 件 是 一 个 服 务 器
13、 控 件。必 须 设 置 为 serverText在在 label 中显示的文本中显示的文本 AccessKey指定热键的按键指定热键的按键 AssociatedControlID将将Label控件与窗体中另一个服务器控件关联起来控件与窗体中另一个服务器控件关联起来表4.6 Label控件的常用属性h 3Literal控件控件Literal控件的工作方式类似于Label控件。用于在浏览器上显示在整个过程中不发生变化的文本。其控件定义的语法示例如下:。属属 性性说说 明明Text规定要显示的文本规定要显示的文本 Mode指定控件对所添加的标记的处理方式指定控件对所添加的标记的处理方式表4.7 L
14、iteral控件的常用属性4.3.2 按钮控件按钮控件h 1Button控件控件h 2LinkButton控件控件h 3ImageButton控件控件作用:提交页面相关事件:(1)Page_load事件(2)Click事件。属性属性/事件事件/方法方法说说 明明Attributes获取控件的属性集合获取控件的属性集合BackColor获取或设置背景色获取或设置背景色BordorColor获取或设置边框颜色获取或设置边框颜色CommandArgument获取或设置可选参数,该参数与获取或设置可选参数,该参数与CommandName一起一起传递到传递到Command事件事件CommandName获
15、取或设置命令名,该命令名与传递给获取或设置命令名,该命令名与传递给Command事件事件的的Button控件相关联控件相关联EnableViewState获取或设置一个值,指示服务器控件是否保持自己及所获取或设置一个值,指示服务器控件是否保持自己及所包含子控件的状态包含子控件的状态PostBackUrl获取或设置单击获取或设置单击Button时从当前页发送到的网页的时从当前页发送到的网页的URL。默认为空,即本页默认为空,即本页Text获取或设置在获取或设置在Button控件中显示的文本标题控件中显示的文本标题Click在单击在单击Button控件时发生的服务器端事件控件时发生的服务器端事件O
16、nClientClick在单击在单击Button控件时发生的客户端事件控件时发生的客户端事件Command在单击在单击Button控件时发生的服务器端事件控件时发生的服务器端事件表4.8 Button控件的常用属性、事件和方法4.3.3 选择和列表控件选择和列表控件(webcontrol1)h1RadioButton控件控件【例4.2】页面上的一组RadioButton控件可以定义如下:属性属性/事件事件说说 明明Checked布尔值,规定是否选定单选按钮布尔值,规定是否选定单选按钮AutoPostBack布尔值,规定在布尔值,规定在 Checked 属性被改变后,是否立即属性被改变后,是否立
17、即回传表单。默认是回传表单。默认是 falseGroupName该单选按钮所属控件组的名称该单选按钮所属控件组的名称OnCheckedChanged当当 Checked 被改变时,被执行的函数的名称被改变时,被执行的函数的名称Text单选按钮旁边的文本单选按钮旁边的文本TextAlign文本应出现在单选按钮的哪一侧(左侧还是右侧)文本应出现在单选按钮的哪一侧(左侧还是右侧)表4.10 RadioButton控件的常用属性和事件h 2RadioButtonList控件控件RadioButton控件优于RadioButtonList控件的一个方面是,可以在RadioButton控件之间放置其他项(
18、文本、控件或图像)。虽然多个RadioButton控件也可以组成单选按钮组以实现互斥选择,但有多个选项供用户进行选择时,使用RadioButtonList控件更加方便。RadioButtonList控件定义示例如下,男女 保密属性属性/事件事件说说 明明AutoPostBack指示当用户改变选项时该控件是否自动地回发到服务器指示当用户改变选项时该控件是否自动地回发到服务器DataMemberDataSource中要绑定的表名中要绑定的表名DataSource填充该列表的列表项的数据源填充该列表的列表项的数据源DataSourceID提供数据的数据源组件的提供数据的数据源组件的IDDataTex
19、tField提供列表项的文本的数据源字段的名称提供列表项的文本的数据源字段的名称DataTextFormatString用来控制列表项的显示方式的格式化字符串用来控制列表项的显示方式的格式化字符串DataValueField提供一个列表项的值的数据源字段的名称提供一个列表项的值的数据源字段的名称Items获得列表控件中的项目集合获得列表控件中的项目集合RepeatColumns获得或设置控件中要显示的列数获得或设置控件中要显示的列数RepeatDirection获得或设置一个指示该控件垂直显示还是水平显示的值获得或设置一个指示该控件垂直显示还是水平显示的值RepeatLayout获得或设置单选
20、按钮(表或流)的布局获得或设置单选按钮(表或流)的布局SelectedIndex获得或设置列表中第一个被选项的索引即索引最小的项获得或设置列表中第一个被选项的索引即索引最小的项SelectedItem获得第一个被选项获得第一个被选项SelectedValue获得第一个被选项的值获得第一个被选项的值TextAlign获得或设置单选按钮的文本对齐方式获得或设置单选按钮的文本对齐方式SelectedIndexChanged当在当在RadioButtonList中改变选择时触发的事件中改变选择时触发的事件表4.11 RadioButtonList控件的常用属性和事件RadioButtonList控件的
21、Items集合的成员和列表中的每一项对应,要确定选中了哪些项,应测试每项的Selected属性。ListItem的基本属性如表4.12所示。属性属性/事件事件说说 明明Text每个选项的文本每个选项的文本Value每个选项的值每个选项的值Selected选项的状态,选项的状态,Ture表示默认选中表示默认选中表4.12 ListItem的基本属性h 3CheckBox控件控件CheckBox控件定义示例如下:属性属性/事件事件说明说明Checked布尔值,规定是否选定单选按钮布尔值,规定是否选定单选按钮AutoPostBack布尔值,规定在布尔值,规定在 Checked 属性被改变后,是属性被
22、改变后,是否立即回传表单。默认是否立即回传表单。默认是 falseOnCheckedChanged当当 Checked 被改变时,被执行的函数的名称被改变时,被执行的函数的名称TextCheckBox控件旁边的文本控件旁边的文本TextAlign文本应出现在文本应出现在CheckBox的哪一侧(左侧还是的哪一侧(左侧还是右侧)右侧)h 4CheckBoxList控件控件【例4.3】CheckBoxList控件定义如下:琴棋 书 画CheckBoxList控件的SelectedIndexChanged事件。h 5DropDownList控件控件【例4.4】DropDownList控件在Web页面
23、上呈现为下拉列表框,它允许用户从预定义的多个选项中选择一项。在选择前,用户只能看到第一个选项,其余的选项都“隐藏”起来。通过设置该控件的高度和宽度(以像素为单位),可以设定控件的大小,但是不能控制该列表拉下时显示的项目数。DropDownList控件定义示例如下:您的学历:博士 硕士本科属性属性/事件事件说明说明AutoPostBack指示当用户改变选项时该控件是否应当自动地回发到服务指示当用户改变选项时该控件是否应当自动地回发到服务器器DataMemberDataSource中要绑定的表的名称中要绑定的表的名称DataSource填充该列表的项目的数据源填充该列表的项目的数据源DataSou
24、rceID提供数据的数据源组件的提供数据的数据源组件的IDDataTextField提供列表的文本的数据源字段的名称提供列表的文本的数据源字段的名称DataTextFormatString用来控制列表项的显示方式的格式化字符串用来控制列表项的显示方式的格式化字符串DataValueField提供一个列表项的值的数据源字段的名称提供一个列表项的值的数据源字段的名称Items获得列表控件中的项目集合获得列表控件中的项目集合SelectedIndex获得或设置列表中被选项的索引获得或设置列表中被选项的索引SelectedItem获得列表中的被选项获得列表中的被选项SelectedValue获得列表中
25、被选项的值获得列表中被选项的值SelectedIndexChanged 当列表控件的选择项发生变化时触发当列表控件的选择项发生变化时触发表4.14 DropDownList控件的常用属性和事件h 6ListBox控件控件【例4.5】ListBox控件定义示例如下:身份:已工作 大学生 中学生/中专技校 以上都不是ListBox控件的SelectedIndexChanged事件。7BulletedList控件控件以下是一个BulletedList控件的定义示例:第一项第二项属属 性性说说 明明BulletImageUrl获得或设置到用做项目符号的图像的路径获得或设置到用做项目符号的图像的路径Bu
展开阅读全文