《ASP.NET网页设计与网站开发教学课件作者马骏党兰学杜莹第5章节ASP.NET控件》由会员分享,可在线阅读,更多相关《ASP.NET网页设计与网站开发教学课件作者马骏党兰学杜莹第5章节ASP.NET控件(35页珍藏版)》请在金锄头文库上搜索。
1、第5章 ASP.NET控件,第5章 ASP.NET控件,5.1 HTML控件和HTML服务器控件 5.2 基本Web服务器控件 5.3 其他服务器控件 5.4 用户控件,第5章 ASP.NET控件,ASP.NET提供了两大类型的控件: HTML控件:以HTML标记呈现的控件,此类控件不仅可以在客户端运行又可将其作为服务器控件运行; Web服务器控件:以“asp:”为前缀的控件,此类控件都运行在服务器端。,5.1 HTML控件和HTML服务器控件,网页文档的document对象包含有一个Form对象,Form对象中包含了与用户交互的各种控件以及其他标记元素。在HTML和XHTML中,控件必须放在
2、form标记范围内。,5.1.1 HTML控件,HTML控件存在于【工具箱】的HTML选项卡下,它是基于HTML标记语言的,主要用于在客户端直接与用户交互。当需要在客户端动态地响应用户的鼠标单击、鼠标移动、键盘输入等交互性比较频繁的操作时,可以使用HTML控件。 常用的HTML控件有:Input(Button)控件、Input(Text)控件以及Input(Radio)控件等。,5.1.1 HTML控件(续),若在.aspx文件的【设计】视图下将HTML控件拖放到设计页面,则在【源】视图中会自动生成代码。例如,向设计页面中拖放一个Input(Button)控件,则在【源】视图中会自动生成如下代
3、码: 注意:HTML控件没有asp标记前缀。早期的HTML文档一般使用name属性来区分不同的元素,而在W3C规定的XML文档规范中不再提供name属性,而是全部以id属性来区分不同的元素,因此系统自动生成的代码只添加了id属性,没有添加name属性。,5.1.2 将HTML控件转换为HTML服务器控件,默认情况下,服务器无法使用ASP.NET网页中的HTML元素,但可以通过将HTML元素转换为HTML服务器控件,将其转换为可在服务器上编程的对象。 ASP.NET页中的大部分HTML元素都可以通过以下方式转换成HTML服务器控件: 1.添加属性 runat=“server“ 在分析过程中,AS
4、P.NET页框架将创建包含runat=“server”属性的所有元素的实例。 2.在网页的【设计】视图下,用鼠标右键单击HTML控件,在弹出的快捷菜单中选择【作为服务器控件运行】,该HTML控件会自动变为HTML服务器控件。,5.1.2 将HTML控件转换为HTML服务器控件(续),HTML服务器控件特点: (1)可在服务器上使用熟悉的面向对象的技术对其进行编程。 (2)提供一组事件,可以为其编写事件处理程序,用法与HTML控件的用法大致相同,不同的是事件处理过程是通过编写服务器代码完成的。 (3)提供了在客户端脚本中处理事件的能力。 (4)自动维护控件状态。在客户端到服务器的往返行程中,将自
5、动对用户在HTML服务器控件中输入的值进行维护并发送回浏览器。,5.1.2 将HTML控件转换为HTML服务器控件(续),(5)与ASP.NET验证控件进行交互,可以验证用户是否已在控件中输入了适当的信息。 (6)数据可以绑定控件的一个或多个属性。 (7)支持样式表。 (8)直接可用的自定义特性。 与Web服务器控件相比,HTML服务器控件没有asp标记前缀。另外,从外观上看,设计页面中控件左上方的绿色三角形表示该控件为服务器控件。,5.2 基本Web服务器控件,基本Web服务器控件: Web服务器按钮控件(Button控件、LinkButton控件和ImageButton控件) TextBo
6、x控件 CheckBox控件和CheckBoxList控件 adioButton控件和RadioButtonList控件 ListBox控件和DropDownList控件。,5.2.1 按钮控件,VS 2005中有以下3种类型的Web服务器按钮控件: (1)Button控件 (2)LinkButton控件 (3)ImageButton控件 3种类型的按钮在鼠标单击时都可以将页面提交给服务器,并触发服务器端对应的Click事件,然后在服务器端执行相应的事件代码。 用法参看教材【例5-2】Web窗体按钮控件示例。,5.2.2 TextBox控件控件,TextBox控件:用于让用户输入文本内容。 T
7、extBox控件常用属性和事件: ID属性 指定控件的名称,它是控件在页面中的唯一标识,代码通过该属性来访问控件 AutoPostBack属性 决定控件中文本内容修改后,是否自动回发到服务器。默认为false,即修改文本后并不立即回发到服务器,而是等页面被提交后一并处理。若为true,则每次更改文本框的内容并且焦点离开控件时,都会自动回发,使服务器处理控件相应的TextChanged事件。,5.2.2 TextBox控件控件(续),TextMode属性 设置文本框接受文本的行为模式。有3种属性值:MultiLine(多行输入模式)、Password(密码输入模式)、SingleLine(默认值
8、,单行输入模式)。 Text属性 设置控件上所要显示的文本。 TextChanged事件 文本框中的内容发生更改且页面回传到服务器端处理时,触发的事件。若AutoPostBack属性设置为true,则每次更改文本框中的内容都会使页面回传到服务器端,并同时触发TextChanged事件。,5.2.3 CheckBox控件与CheckBoxList控件,CheckBox控件 用于向用户提供选项,适用于选项不多且比较固定的情况。 CheckBoxList控件 用于向用户提供选项列表,适用于选项较多或在运行时动态地决定有哪些选项时。,5.2.3 CheckBox控件与CheckBoxList控件(续)
9、,CheckBox控件的常用属性和事件: ID属性 指定控件的名称,控件在页面中的唯一标识。 AutoPostBack属性 决定CheckBox控件状态更改后是否自动回传到服务器处理。 Items属性 表示控件对象中所有项的集合。,5.2.3 CheckBox控件与CheckBoxList控件(续),RepeatColumns属性 指示控件中显示CheckBox项的列数。 RepeatDirection属性 决定控件中各CheckBox项的显示方法。默认值是Vertical,各项按垂直方式排列显示;Horizontal使各项按水平方式排列显示。 CheckedIndexChanged事件 更改
10、CheckBoxList控件中的选项,回传到服务器端处理时触发的操作。,5.2.4 RadioButton控件与RadioButtonList控件,RadioButton控件: 一般情况下,Web窗体将同一容器中的所有RadioButton控件视为不同的组,可以多选。但也可以通过使用GroupName属性将同一容器中的多个RadioButton控件作为一组使用。 RadioButton控件的GroupName属性:自定义单选按钮组名,具有相同组名的单选按钮可以作为一组互斥的控件来使用。 RadioButtonList控件也是封装了一组单选按钮控件的列表控件,其主要的属性、事件与CheckBox
11、List服务器控件相同。,5.2.5 ListBox控件和DropDownList控件,ListBox控件(列表框控件) 用来显示一组条目,用户可从中选择一条或多条。 ListBox控件常用的属性 Items属性:用于编辑控件中所要显示的列表项。 SelectionMode属性:用于指定ListBox控件的模式行为。Single表示每次选择一个条目,Multiple表示每次可以选择多个条目。 ListBox控件常用事件 SelectedIndexChanged事件,当选定项发生更改时触发该事件。,5.2.5 ListBox控件和DropDownList控件(续),DropDownList控件
12、为用户提供一些选项的控件。 DropDownList控件常用属性 AutoPostBack属性和Items属性 DropDownList控件常用事件 SelectedIndexChanged事件。 用法参看教材【例5-6】列表框控件和下拉列表框控件示例。,5.3 其他服务器控件,其他服务器控件: Image控件和ImageMap控件:图像相关。 Literal控件与Panel控件:容器控件。 View控件与MultiView控件:用作其他控件和标 记的容器。,5.3.1 Image控件和ImageMap控件,1Image控件 用于在ASP.NET网页上显示图像,此控件不支持任何事件。 Imag
13、e控件的常用属性: ID 指定控件的名称,控件在页面中的唯一标识。 ToolTip 浏览器显示在工具提示中的文本,当鼠标停在图片上面时也显示该内容。,5.3.1 Image控件和ImageMap控件(续),AlternateText 无法找到图像文件时显示的文本。 GenerateEmptyAlternateText 如果将此属性设置为true,所呈现的图像元素的alt属性将被设置为空字符串。 ImageAlign 使用如Top、Bottom、Left、Middle和Right这样的值将图像与环绕文本对齐。,5.3.1 Image控件和ImageMap控件(续),2ImageMap控件 使用此
14、控件可以创建一个能与用户交互的图像,该图像包含许多用户可以单击的区域,这些区域被称为作用点。每一个作用点都可以是一个单独的超链接或回发事件。 ImageMap控件由两个部分组成:图像与作用点控件的集合。其中,图像可以是任何标准Web图形格式的图形,如.gif、.jpg或.png图形文件。每个作用点控件都是一个不同的元素。对于每个作用点控件,需要定义其形状(圆形、矩形或多边形)以及用于指定作用点的位置和大小的坐标。,5.3.1 Image控件和ImageMap控件(续),程序员可以指定在用户单击ImageMap控件上的某个作用点时发生的事件。 可以将每个作用点配置为超链接,通过超链接转到该作用点
15、提供的URL。 可以将控件配置为在用户单击某个作用点时执行回发,为每个作用点提供一个唯一值。当页面提交到服务器时,会引发ImageMap控件的Click事件。在事件处理程序中,可以根据分配给每个作用点的唯一值进行相应的处理。,5.3.2 Literal控件与Panel控件,1Literal控件 此控件可作为页面上其他内容的容器,常用于向页面中动态添加内容。当希望文本和控件直接呈现在页面中而不使用任何附加标记时,可使用此控件。 Literal控件常用的属性如下: Mode属性:用于指定控件对所添加的标记的处理方式。Mode属性值有三个,分别是Transform、PassThrough和Encod
16、e。,5.3.2 Literal控件与Panel控件(续),Transform 添加到控件中的任何标记都将进行转换,以适应请求浏览器的协议。适用于向使用HTML外的其他协议的移动设备呈现内容。 PassThrough 添加到控件中的任何标记都将按原样呈现在浏览器中。 Encode 添加到控件中的任何标记都将使用HtmlEncode方法进行编码,该方法将把HTML编码转换为其文本表示形式。,5.3.2 Literal控件与Panel控件(续),2Panel控件用处 在Web窗体页内提供了一种容器控件,可以将它用作静态文本和其他控件的父级。 对控件和标记进行分组 具有默认按钮的窗体 动态生成控件的容器 页上的自定义区域 添加滚动条。 创建一个带标题的分组框。 在页上创建具有自定义颜色或其他外观的区域。,5.3.3 View控件与MultiView控件,View控件和MultiView控件都可用作其他控件和标记的容器,一般情况下,可以用View控件实现一个页面的功能,而MultiView控件可以操纵多个View控件。 1View控件与MultiView控件简介 使