《ASP.NET程序设计实用技术教学课件王凤岭第3章节》由会员分享，可在线阅读，更多相关《ASP.NET程序设计实用技术教学课件王凤岭第3章节（70页珍藏版）》请在金锄头文库上搜索。
1、第3章 Web窗体和服务器控件,3.1 Web窗体,3.1.1 Web窗体概述 Web窗体（简称WebForm）是ASP.NET页面的一种类型，含有一个交互式的窗体（即页面中有一个元素），是服务器端与客户端浏览器之间数据传递的一种结构模式。,ASP.NET的用户界面编程分为两个不同的部分： 可视组件（放置于.aspx页面中） 逻辑（放置于.aspx.vb） Visual Studio.NET采用CodeBehind技术，将页面表示代码和服务器处理代码独立开来。,Web窗体文件结构,项目中所有Web窗体页的代码隐藏类文件都被编译成项目动态链接库DLL文件。 .aspx页在用户第一次浏览时被编译，
2、生成表示该页的.NET类文件，并将其编译成另一个DLL文件。,Web窗体由HTML、控件和逻辑代码联合组成，其中控件在运行Internet信息服务（IIS）的Web服务器上执行，这是Web窗体的一个关键特性。 客户端界面和服务器端代码的分离是Web窗体和传统Web页的关键区别。,默认Web窗体的代码, WebForm1 ,语句块用于存放在服务器端执行的代码及指令 标记表示“页面属性”，定义了Web页面特定的属性 。一个.aspx文件只能包含一个标记。,表3.1 标记的常用属性,标记,定义了如何处理窗体中的控件。 提供的几个属性： “Mothod”属性 该属性定义了将控件的值送回服务器端的传输方
3、式，可以设置的值有“Post”和“Get”。 “Runat”属性 如果该属性的值被设置为“server”能使窗体将控件信息送回（PostBack）到服务器端的ASP.NET页面进行处理，否则该窗体作为一般的HTML窗体运行。,3.1.2 使用Visual Studio.NET 创建Web窗体,Visual Studio.NET 2003的“设计”视图编辑界面提供了两种定位HTML元素的方式： 流布局（FlowLayout） 允许元素在一行内从左向右流动，在页面内从上向下流动（如同在文字处理软件中那样）。 网格布局（GridLayout），默认方式 允许控件与网格对齐，控件可放置在页上的绝对位置
4、处（使用x和y坐标）。,3.1.3 将html页面转换为web窗体,在Visual Studio.NET中设计用户界面并不方便。用户可以使用Dreamweaver等工具来设计用户界面，然后导入到Visual Studio.NET中，转换成.aspx页面。,3.2 服务器控件概述,HTML服务器控件 将HTML元素添加了id和runat=“server”等服务器属性后，即可使它成为了可编程的HTML服务器控件。 Web服务器控件 包含例如如按钮和文本框等窗体类型控件，还包括例如数据验证等特殊用途的控件。,验证控件 用于测试用户的输入是否合法 用户控件 是用户创建的一个ASP.NET页面，类似于W
5、eb服务器控件，用户控件提供了用户界面和其他相关的功能，能够被其他ASP.NET Web窗体作为服务器控件导入。,3.3 HTML服务器控件,3.3.1 HTML服务器控件概述,HTML服务器控件是在原有的HTML元素的基础上，加上Runat=“server”属性后变成的服务器控件。 HTML服务器控件与传统的HTML元素类似，但是传统的HTML元素无法以编程方式直接控制属性、方法和事件。,HTML元素转换成HTML服务器控件的示例 HTML文本框元素如下： 转换为HTML服务器控件以后： ,3.3.2 常用的HTML服务器控件,（见P4647图表）,3.4 Web服务器控件,3.4.1 We
6、b服务器控件概述 与HTML服务器控件相比，Web服务器控件具有更多的内置功能。 Web服务器控件运行在服务器上 ，可用编程方式控制这些控件。 可以绑定到数据源,在设计时的“HTML”视图中，显示在页中的Web服务器控件的格式： 常用Web服务器控件的功能 （见P49-表3.4）,3.4.2 Label控件,作用： 在页面的指定位置显示文本 主要属性： Text：指定Label控件显示的文字。 ForeColor：指定Label控件显示文字的颜色。 Font：指定Label控件显示文字的字体属性，包括字体名称、大小等。,3.4.3 TextBox控件,作用： 让用户输入文本，或者显示用户输入的
7、信息 主要属性： （见P50-表3.5）,3.4.4 Button控件,作用： 接收用户对Button的Click（单击）事件，并执行相应的事件处理程序来完成相应的操作。,Button控件的主要属性,主要事件： “提交”按钮有OnClick方法 绑定于DataGrid的“命令”按钮，当按钮事件被触发时，通过CommandName属性区别哪些按钮被触发（在数据库编程的章节中详细学习）。,3.4.5 HyperLink与LinkButton控件,作用： HyperLink控件的主要用于创建超级链接。 LinkButton控件综合了HyperLink控件和Button控件的功能，它以超级链接的形式显
8、示，而执行的却是按钮的功能。它的属性与Button控件的属性相同。,HyperLink控件的主要属性,3.4.6 Image与ImageButton控件,作用： Image控件用于在页面上显示图像。 ImageButton控件综合了Image控件和Button控件的功能，它在页面上以图像的形式显示，而执行的却是按钮的功能。,Image控件的主要属性,3.4.7 DropDownList与ListBox控件,作用： DropDownList控件主要用于创建一个下拉列表框，允许用户从预定义列表中选择一个单一的值。DropDownList不支持多重选择模式。 ListBox控件主要用于创建允许单项或
9、多项选择的列表框。,DropDownList控件的主要属性,DropDownList控件列表项的主要属性,事件 当用户从DropDownList控件中选择某项时，将引发SelectedIndexChanged事件。 注意：默认情况下，此事件不会导致向服务器发送页面（PostBack），但是可以通过将AutoPostBack属性设置为True，使此控件强制立即发送。,ListBox控件的主要属性 (P53-表3.11),3.4.8 CheckBox与CheckBoxList,作用： 两种控件都为用户提供了一种输入布尔型数据（真或假、是或否）的方法。 CheckBoxList控件提供可以通过数据绑
10、定动态生成的多项选择复选框组。,CheckBox控件的主要属性,CheckBoxList控件的主要属性,事件： 单个CheckBox 控件 用户单击此控件时引发CheckedChanged事件。 CheckBoxList 控件 用户选择列表中的任意复选框时，将引发SelectedIndexChanged事件。 注意：默认情况下，此事件不导致向服务器回发窗体，但可以通过将AutoPostBack属性设置为true，来指定此选项。,将数据绑定到控件 可以将单个 CheckBox 控件绑定到数据源，并且可以将 CheckBox 控件的任意属性绑定到数据源的任意字段。 例如，一种常见的做法是根据数据库
11、中的信息设置控件的 Checked 属性。,也可以将 CheckBoxList 控件绑定到数据源。在这种情况下，各个复选框分别代表数据源中的不同记录。,3.4.9 RadioButton、RadioButtonList,作用： 两个按钮的作用分别与CheckBox和CheckBoxList一致，只是前者只能做单选。 事件： 单个RadioButton控件在用户单击控件时引发CheckedChanged事件。 RadioButtonList控件在用户更改列表中选定的单选按钮会引发 SelectedIndexChanged事件。,3.4.10 Panel控件,Panel Web 服务器控件在页面内
12、为其他控件提供一个容器。通过将多个控件放入 Panel 控件，可将它们作为一个单元进行控制，例如，隐藏或显示它们。,3.4.10 Panel控件,适用于： 1分组行为通过将一组控件放入一个Panel，然后操作该Panel，可将这组Panel作为一个单元进行管理。（如：通过设置面板的Visible属性来隐藏或显示该面板中的一组控件） 2动态控件生成Panel控件为在运行时创建的控件提供了一个方便的容器。 3外观Panel控件支持BackColor和BorderWidth等外观属性，可以设置这些属性来为页面上的局部区域创建独特的外观。,3.4.11 AdRotator控件,作用： 在Web页上显示
13、随机选定的广告条，并在一系列广告条间循环。AdRotator自动进行循环处理，在每次刷新页面时更改显示的广告。广告可以加权以控制广告条的优先级，这可以使某些广告的显示频率比其他广告高，也可以编写在广告间循环的自定义逻辑。,3.4.12 Calendar控件,作用： 1显示和选择日期 该控件显示一个日历，用户通过此日历可定位到任意一年中的任意一天。设置SelectedDate属性，使某个特定的日期在控件中突出显示。用户还可通过单击一个日期或在不同的月份之间移动，以移动到任意日期。还可配置日历以允许用户选择多个日期，包括整周或整月。 2在日历网格中显示约会或其他信息 Calendar控件可为个别日
14、期，显示该日期特定的详细信息，如一份事务列表、一份事件时间表或类似的信息。该功能允许显示数据库中的日期信息。,3.5 服务器端数据验证控件,验证服务器控件是一个控件集合，这些控件允许验证关联的输入服务器控件（如 TextBox），并在验证失败时显示自定义消息。每个验证控件执行特定类型的验证。,例如，可通过使用 CompareValidator 和 RangeValidator 控件分别针对某个特定值或值范围进行验证。甚至还可通过使用 CustomValidator 控件定义自己的验证判据。由于错误信息在验证控件中显示，可通过将验证控件放置在所需位置来控制在 Web 页中显示消息的位置。使用 V
15、alidationSummary 控件，还可以显示页上所有验证控件的结果摘要。,默认情况下，当单击按钮控件（如 Button、ImageButton 或 LinkButton）时，即执行页验证。可通过将按钮控件的 CausesValidation 属性设置为 false 而阻止在单击按钮控件时执行验证。“取消”或“清除”按钮的该属性通常设置为 false，以防止在单击按钮时执行验证。,ControlToValidate 验证控件将计算的输入控件的编程 ID。如果此为非法 ID，则引发异常。 Display 指定的验证控件的显示行为。此属性可以为下列值之一： None 验证控件从不内联显示。如果
16、希望仅在 ValidationSummary 控件中显示错误信息，则使用此选项。 Static 如果验证失败，验证控件显示错误信息。即使输入控件通过了验证，也在 Web 页中为每个错误信息分配空间。当验证控件显示其错误信息时，页面布局不变。由于页面布局是静态的，同一输入控件的多个验证控件必须占据页上的不同物理位置。 Dynamic 如果验证失败，验证控件显示错误信息。当验证失败时，在页上动态分配错误信息的空间。这允许多个验证控件共享页面上的同一个物理位置。 注意 由于验证控件的空间是动态创建的，所以页面的物理布局会发生更改。为了防止页面布局在验证控件变得可见时更改，必须调整包含验证控件的 HTML 元素的大小，使其大得足以容纳验证控件的最大大小。,EnableClientScript 指示是否启用客户端验证。通过将 EnableClientScript 属性设置为 false，可在支持此功能的浏览器上禁用客户端验证。 Enabled 指示是否启用验证控件。可通过将该属性设置为 false 以阻止验证控件
