《ASP.NET程序设计 教学课件 ppt 作者 崔永红 等 第4章》由会员分享，可在线阅读，更多相关《ASP.NET程序设计 教学课件 ppt 作者 崔永红 等 第4章（108页珍藏版）》请在金锄头文库上搜索。
1、第1页,第4章,服务器端控件,第2页,主要内容,服务器端控件概述 HTML服务器端控件 Web服务器端控件 验 证 控 件 用 户 控 件 扩 展 控 件 控件的动态数据绑定,第3页,4.1 服务器端控件概述,这一章将学习ASP.NET的服务器端控件的使用，ASP.NET的服务器端控件是一组可以复用的组件，它们从System.Web.UI.WebControls基类中派生出来。 ASP.NET的服务器端控件可以分为Web服务器端控件、HTML服务器端控件、用户控件和扩展控件，它们都运行在服务器端，并且以对象的形式出现。有了这些服务器控件，就可以通过编程的方式，获取或设置对象的属性，控件也能对相
2、应的事件作出响应，从而更好地控制 控件在页面上的表现形式。,第4页,4.2 HTML服务器端控件,HTML服务器端控件概述 HtmlAnchor控件 HtmlButton控件 HtmlImage控件 HtmlInputButton控件 HtmlInputCheckBox控件 HtmlInputFile控件 HtmlInputImage控件 HtmlInputRadioButton控件 HtmlInputText控件 HtmlSelect控件 HtmlTable控件 HtmlTableRow控件 HtmlTableCell控件 HtmlTextArea控件,第5页,4.2.1 HTML服务器端控
3、件概述,HTML服务器端控件就是将所有的HTML标记对象化，每一个HTML服务器端控件都能映射到相应的HTML元素。由于HTML服务器端控件是对象化的组件，我们便可以使用面向对象的技术在服务器上以编程的方式来访问这些对象的属性或事件了。 在Visual Studio .NET集成环境中，工具箱中的HTML控件是运行在客户端的控件，如图4-3所示的控件都是HTML控件，当将其拖放到设计视图的页面上时，控件左上角并没有绿色三角形标志，说明它是运行在客户端。例如Button控件，在HTML视图中可以看到： ,第6页,4.2.1 HTML服务器端控件概述,为了让这个控件运行在服务器端，必须在其中加ru
4、nat=“Server“属性，另外为了更好地在代码中引用它，使它具有唯一性，还可以给它加上ID属性。 加上了ID=“Button1“ runat=“Server“属性后，再切换到设计视图就可以看到在该Button控件的左上角出现了绿色三角形标志，指示该控件是基于服务器的控件。对于这样的HTML服务器端控件，也能将其响应事件的代码写在代码隐藏页中，使得程序的结构更加清晰。 下面就介绍常用的HTML服务器端控件的使用。,第7页,HTML服务器端控件,第8页,4.2.2 HtmlAnchor控件,创建一个服务器端控件，该控件映射到 HTML 元素并允许链接到其他Web页。其语法如下： linktex
5、t,第9页,HtmlAnchor控件的常用属性,第10页,4.2.2 HtmlAnchor控件,使用 HtmlAnchor 控件以编程方式控制 HTML 元素。此服务器控件通常用于动态修改 元素的属性，显示来自数据源的超链接和控制事件以动态生成 HtmlAnchor 控件。 可以通过使用 Target 属性来指定显示新 Web 页的位置。除了以下画线开始的特殊值 _blank、_self、_parent 和 _top 外，还可以是框架结构中的框架名，不过框架名取值必须以 a z（不区分大小写）范围中的字母开头。 下面的示例说明当 Page_Load 事件发生时，如何动态地将一个 URL 与 H
6、tmlAnchor 控件关联。,第11页,4.2.3 HtmlButton控件,创建一个服务器端控件，该控件映射到 HTML元素并允许创建普通按钮。 其语法如下： buttontext ,第12页,HtmlButton控件的常用属性,第13页,4.2.4 HtmlImage控件,创建一个服务器端控件，该控件映射到HTML元素并 允许显示图像。其语法如下： ,第14页,4.2.5 HtmlInputButton控件,创建一个服务器端控件，该控件映射到 、 和 HTML元素，并允许分别创建命令按钮、提交按钮或重置按钮。其语法如下： ,第15页,HtmlInputButton控件的常用属性,第16页
7、,4.2.5 HtmlInputButton控件,使用HtmlInputButton 控件对、和 HTML 元素进行编程。用户单击 HtmlInputButton 控件时，来自嵌有该控件的窗体的输入被发送到服务器并得到处理，然后，将响应发送回请求浏览器。 通过为OnServerClick事件提供自定义事件处理程序，可以在单击控件时执行特定的指令集。,第17页,4.2.6 HtmlInputCheckBox控件,创建一个服务器端控件，该控件映射到 HTML元素并允许创建使用户可以选择true或false状态的复选框控件。其语法如下： ,第18页,HtmlInputCheckBox控件的常用属性,
8、第19页,4.2.6 HtmlInputCheckBox控件,使用HtmlInputCheckBox 控件对 HTML 元素进行编程。单击 HtmlInputCheckBox 控件时，该控件不会向服务器回送。当使用回送服务器的控件（如 HtmlInputButton 控件）时，复选框的状态被发送到服务器进行处理。若要确定是否选中了复选框，请测试控件的 Checked 属性。,第20页,4.2.7 HtmlInputFile控件,创建一个服务器端控件，该控件映射到 HTML 元素并允许将文件上载到服务器。其语法如下： ,第21页,HtmlInputFile控件的常用属性,第22页,4.2.7 H
9、tmlInputFile控件,使用HtmlInputFile控件对HTML 元素进行编程。可以使用 HtmlInputFile 控件方便地设计页，该页允许用户将二进制文件或文本文件从浏览器上载到Web 服务器上指定的目录中。,第23页,4.2.8 HtmlInputImage控件,创建一个服务器端控件，该控件映射到 HTML 元素并允许创建显示图像的按钮。其语法如下： ,第24页,HtmlInputImage控件的常用属性,第25页,4.2.8 HtmlInputImage控件,使用 HtmlInputImage 控件对 HTML 元素进行编程。可以将此控件与 HtmlInputText及其他
10、控件一起使用以构造用户输入窗体。因为此控件是在服务器上运行的 元素，所以它提供与 HTML 相同的按钮自定义。此控件可以替代不支持 DHTML 和 HtmlButton 控件的浏览器。,第26页,4.2.9 HtmlInputRadioButton控件,创建一个服务器端控件，该控件映射到HTML元素并允许在Web 页上创建单选按钮。其语法如下： ,第27页,HtmlInputRadioButton控件的常用属性,第28页,4.2.9 HtmlInputRadioButton控件,使用HtmlInputRadioButton 控件对 HTML 元素进行编程。通过将Name属性设置为组中所有元素所
11、共有的值，可以将多个HtmlInput- RadioButton 控件组成一组。同组中的单选按钮互相排斥，一次只能选择该组中的一个单选按钮。,第29页,4.2.10 HtmlInputText控件,创建一个服务器端控件，该控件映射到 和 HTML元素，并允许您创建单行文本框以接收用户输入。其语法如下： ,第30页,4.2.10 HtmlInputText控件,使用HtmlInputText 控件对 和 HTML 元素运行服务器代码。与标准 HTML 一样，这些控件可用于在HTML窗体中输入用户名和密码。当Type属性的设置为password时，文本框中的输入将受到屏蔽。通过使用MaxLengt
12、h、Size和Value属性，可以分别控制可输入的字符数、控件宽度和控件内容。,第31页,4.2.11,创建一个服务器端控件，该控件映射到 HTML 元素并允许创建列表控 件。其语法如下： value1 value2 ,第32页,HtmlSelect控件的常用属性,第33页,4.2.11,使用HtmlSelect控件对HTML元素进行编程。默认情况下，此控件呈现为下拉列表框。但是，如果允许多重选择（通过指定Multiple 属性）或为Size属性指定大于1的值，则该控件将显示为列表框。 若要确定单选HtmlSelect控件中的选定项，首先使用SelectedItem 属性获取选定项的索引。然后
13、，可以使用此索引从Items集合中检索选定项。,第34页,4.2.11,若要确定允许同时进行多重选择的HtmlSelect控件中的选定项，则需要循环访问Items 集合并测试每项的Selected属性。 还可以将该控件绑定到数据源。设置DataSource属性以指定要将其绑定到该控件的数据源。将数据源绑定到控件后，可以通过设置DataValueField和DataTextField属性，分别指定将哪个字段绑定到Value和Text属性。 此控件有一个重要的OnServerChange事件，用来设置当该控件的选项发生变化时触发的事件。,第35页,4.2.12 HtmlTable控件,创建一个服务
14、器端控件，该控件映射到HTML元素并允许用户创建表。其语法如 下： ,第36页,4.2.12 HtmlTable控件,使用HtmlTable控件对HTML元素进行编程。HtmlTable控件由一个表的Rows集合中存储的行（由HtmlTableRow对象表示）组成。每行均由存储在行的Cells集合中的单元格（由HtmlTableCell对象表示）组成。 若要创建表，首先应在页上的窗体中声明一个HtmlTable控件。然后，将HtmlTableRow 对象放置在HtmlTable控件的开始和结束标记之间（对于表中所需的每一行放置一个对象）。定义表中的行之后，声明位于每个HtmlTableRow对
15、象的开始和结束标记之间的 HtmlTableCell对象以创建该行的单元格。,第37页,4.2.12 HtmlTable控件,请确保每行和每列中的单元格的数目正确，否则该表可能不会按预期的方式显示。一般情况下，各行的单元格数应相同。同样，各列的单元格数也应相同。如果要合并单元格，则各行的宽度应相同，各列的高度也应相同。 HtmlTable 控件允许用户自定义表的外观。通过设置BgColor、Border、BorderColor、Height和Width 属性，可以分别指定表的背景色、边框宽度、边框颜色、表高度和表宽度。通过设置CellSpacing和CellPadding 属性，还可以控制单元
16、格间的间距以及单元格内容与单元格边框间的间距。,第38页,4.2.13 HtmlTableRow控件,创建一个服务器端控件，该控件映射到HTML的元素并允许创建和 操作表中的行。其语法如下： cellcontent cellcontent cellcontent ,第39页,4.2.13 HtmlTableRow控件,使用HtmlTableRow类对HTML的元素进行编程。元素表示表中的行。 HtmlTableRow 类使用户可以控制表中各个独立行的外观。通过设置 BgColor、BorderColor和Height属性，可以分别控制该行的背景色、边框颜色和高度。这些与HtmlTable 控件类似，比较重要的是Cells、Align和Valign属性。 通过设置Align和Valign属性分别控制行中单元格内容的水平和垂直对齐方式。 表中的每行都包含一个Cells集合，该集合对于该行中的每个单元格都包含一个 HtmlTableCell。,第40页,4.2.14 HtmlTableCell控件,创建一个服务器端控件，该控件映射到和 HTML元素并允许操 作表中的单元格。其语法如下：
