HTML服务器控件

课程名称：.NET应用开发第十章服务器控件--1《10.2HTML服务器控件》1.目标概述[2分钟].................................................................................................................22.回顾[5分钟].........................................................................................................................23.课程知识点讲解.......................................................................................................................23.1.HTML服务器控件简介[45分钟]...................................................................23.2.HtmlForm控件[20分钟].................................................................................53.3.HtmlInputFile控件[15分钟]...........................................................................54.小结[3分钟].........................................................................................................................65.考核点.......................................................................................................................................76.作业答案...................................................................................................................................77.扩展练习...................................................................................................................................88.学生问题汇总...........................................................................................................................89.教学后记...................................................................................................................................8课程名称：.NET应用开发第十章服务器控件--2本节目标本节中将讲述如下主要内容：HTML服务器控件简介HTML服务器控件的公共属性HTML服务器控件的公共事件HtmlForm控件HtmlInputFile控件通过教学使学生熟悉HTML服务器控件及其应用。本节重点HTML服务器控件的公共属性HTML服务器控件的公共事件HtmlForm、HtmlInputFile控件本节难点授课课时2课时教法建议1.目标概述[2分钟]本节主要讲述HTML服务器控件及其应用。2.回顾[5分钟]回顾上一节的相关知识。3.课程知识点讲解3.1.HTML服务器控件简介[45分钟]引入：主题：（1）HTML服务器控件的概述HTML服务器控件提供以下功能：可在服务器上使用熟悉的面向对象技术对其进行编程的对象模型。每个服务器控件都公开一些属性，这些属性使您得以在服务器代码中通过编程操作该控件的课程名称：.NET应用开发第十章服务器控件--3HTML属性。提供一组事件，您可以为其编写事件处理程序，方法与在基于客户端的窗体中大致相同，所不同的是事件处理是在服务器代码中完成的。在客户端脚本中处理事件的能力。自动维护控件状态。在窗体到服务器往返期间，用户在HTML服务器控件中输入的值将在页发送回浏览器时自动维护。可与验证控件进行交互，便于您验证用户是否在控件输入了适当的信息。可实现数据绑定，将将数据绑定到一个或多个控件属性。支持自定义属性。可以将任何需要的属性添加到HTML服务器控件，页框架将读取并在客户端显示它们而不更改其任何功能。这将允许开发人员向控件添加浏览器特定的属性。（2）HTML元素到服务器的转换1．手动编码转换①通过添加RUNAT=SERVER属性，HTML元素即可转换为服务器控件。②如果要在代码中作为成员引用该控件，则还应当为控件分配ID属性。2．使用VisualStudio.NET进行转换（3）HTML服务器控件HTML元素控件类型用途aHtmlAnchor允许以编程方式访问HTML锚元素。注：公开ServerClick事件buttonHtmlButton允许以编程方式访问HTML按钮元素。此元素由HTML4.0规范定义，且只能被IE4.0以上版本支持。注：公开ServerClick事件formHtmlForm允许以编程方式访问HTML表单元素。充当其他服务器控件的容器，任何要参与回传的控件都应包含在HtmlForm控件中。imgHtmlImage允许以编程方式访问HTML图像元素。inputtype=”button”inputtype=”submit”inputtype=”reset”HtmlInputButton允许以编程方式访问button、submit和reset输入类型的HTML输入元素。注：公开ServerClick事件inputtype=”checkbox”HtmlInputCheckBox允许以编程方式访问CheckBox输入类型的HTML输入元素。注：公开ServerChange事件inputtype=”file”HtmlInputFile允许以编程方式访问file输入类型的HTML输入元素。inputtype=”hidden”HtmlInputHidden允许以编程方式访问Hidden输入类型的HTML输入元素。课程名称：.NET应用开发第十章服务器控件--4注：公开ServerChange事件inputtype=”image”HtmlInputImage允许以编程方式访问用于image输入类型的HTML输入元素。注：公开ServerClick事件inputtype=”radio”HtmlInputRadioButton允许以编程方式访问用于radio输入类型的HTML输入元素。selectHtmlSelect允许以编程方式访问HTML的选择元素注：公开ServerChange事件tableHtmlTable允许以编程方式访问HTML的表元素注：HtmlTable控件不支持某些表的子元素（如col、tbody、thead等。td和thHtmlTableCell允许以编程方式访问HTML表的单元格trHtmlTableRow允许以编程方式访问HTML表的行textareaHtmlTextArea允许以编程方式访问HTML文本区域注：公开ServerChange事件body、div、font等HtmlGenericControl允许以编程方式访问未被HTML控件类明确表示的HTML元素。（4）HTML服务器控件的公共属性HTML服务器控件具有一些公共属性，下面将分别讨论。1．全部HTML服务器控件的公共属性Attributes属性：Attributes集合包含控件标记定义里的所有属性的名称/值对，如下代码演示了Attributes属性的用法。[示例讲解]示例10.2.1Attributes属性演示。示例10.2.2TagName属性演示。2．所有HTML输入控件共享的属性HTML输入控件映射到标准HTML输入元素。它们包含type属性，该属性定义它们在Web页中呈现的输入控件的类型。HtmlInputText、HtmlInputButton、HtmlInputCheckBox、HtmlInputImage、HtmlInputHidden、HtmlInputFile和HtmlInputRadioButton控件共享下列属性。3．所有HTML容器控件共享的属性HTML容器控件映射到HTML元素，这些元素需要具有开始和结束标记，如select、a、button和form元素。HtmlTableCell、HtmlTable、HtmlTableRow、HtmlButton、HtmlForm、HtmlAnchor、HtmlGenericControl、HtmlSelect和HtmlTextArea控件共享下列属性。（5）HTML服务器控件的公共事件HTML控件可以处理服务器端事件和HTML元素映射的客户端事件，HTML服务器控件可以映射的客户端事件有两个：ServerClick事件：HtmlAnchor、HtmlButton、HtmlInputButton、HtmlInputImage控件可以将客户端的Click事件映射到服务器端，使得当这4类控件被点击时，就会课程名称：.NET应用开发第十章服务器控件--5触发服务器端的ServerClick事件。ServerChange事件：HtmlInputCheckBox、HtmlInputHidden、HtmlInputRadioButton、HtmlInputText、HtmlSelect、HtmlTextArea控件可以在其值发生变化时，通过映射触发服务器端的ServerChange事件。当这些事件被触发时，客户端和服务器之间将进行一次数据交换，下面以一个示例演示如何处理由客户端映射服务器端的事件。[示例讲解]示例10.2.3HTML服务器控件客户端事件触发服务器事件示例。3.2.HtmlForm控件[20分钟]引入：主题：可以使用HtmlForm控件对HTMLform元素进行编程。如果要利用回传服务，则所有Web窗体控件都必须嵌套在HtmlForm控件开始和结束标记之间。如果没有正确结束标记，ASP.NET将无法识别该元素。该元素将被忽略或者将发生编译错误。HtmlForm控件以下标签构成：formid=标识符method=POST|GET!--提交方式--action=目标页面的URLrunat=server其他控件，输入表单等/form[示例讲解]示例10.2.4HTMLForm控件使用示例3.3.HtmlInputFile控件[15分钟]引入：主题：HtmlInputFile控件用于将文件从客户端上传到服务器中，HtmlInputFile控件对应于Html元素inputtype=file标签。该标签将在页面上显示一个文本框和一个用于查找文件的浏览按钮。用户可以通过点击该按钮来打开选择文件对话框来选择文件，选中的文件将显示在文本框中。HtmlInputFile控件由以下标签表示：inputt