第06章web窗体与基本控件

第6章Web窗体与

基本控件09一月20232Ch6Web窗体与基本控件6.1基于事件的编程模型6.2界面交互控件的分类6.3HTML控件的基本用法6.4基本Web服务器控件6.5ASP.NET内置对象与状态管理6.6页面切换与页间数据传递6.7用户控件6.1基于事件的编程模型Web窗体页Web窗体页的组成及特征，一个Web窗体默认由两个文件组成扩展名为.aspx的页面描述文件，称为代码隐藏页扩展名为.aspx.cs的文件，该文件对应的类称为代码隐藏类。

代码隐藏类作用所有代码隐藏文件都会自动被编译为.dll文件。当用户请求Web窗体页的URL时，ASP.NET将在服务器上调用对应的.dll文件，并动态地生成HTML页面输出到客户端，供浏览器解析和显示新建Web窗体页，观察窗体组成及@Page指令09一月202336.1基于事件的编程模型在客户端向服务器发送信息的过程中，提交方式有GET：将数据附加在URL的后面用显式方式提交POST：将数据包含在文件头中用隐式方式提交默认采用POST方式提交数据09一月202346.1基于事件的编程模型GET方式通过URL请求来传递用户请求的数据，将表单内各字段名称及其内容，以字符串的形式放在向服务器提交的URL的后面指定方式：在form的开始标记内指定method="get"。注意：如果URL后有参数，该URL和其后面的参数信息也会在浏览器的地址栏中显示出来。09一月202356.1基于事件的编程模型POST方式POST方式将表单内各字段名称及其内容放置在HTML的头文件内传送给服务器ASP.NETWeb窗体页默认使用的方式。当客户端使用POST方式向服务器提交数据时，如果页面元素没有runat="server"声明，则服务器只能通过Request.Form来获取提交的内容。09一月202366.1基于事件的编程模型Web窗体页对GET和POST的封装GET与POST缺点在HTML页中，不论是使用GET还是POST，如果开发人员希望客户端发出请求后，服务器将处理结果再返回到发出请求的页面，每次都考虑用GET还是POST非常繁琐。在Web窗体中使用ASP.NETWeb服务器控件（前缀为“asp:”的控件），简化了页面设计的复杂度显著提高了Web应用程序开发的效率。09一月202376.1基于事件的编程模型Web窗体页的往返机制ASP.NET的Web窗体页是在服务器上运行的，要使页面中的按钮或其他内容得到处理，必须将这些信息提交到服务器。每次页面提交时，都会再次运行其服务器端代码，然后向用户呈现新的页面，基本处理过程如下：用户通过客户端浏览器请求页面，页面第一次运行。程序员可以通过在Page_load事件中编写代码对页面进行初步处理，例如初始化页面等。服务器将代码转换为能被客户端识别的HTML标记发送到客户端，客户端浏览器对HTML进行解析并将其显示出来。用户通过界面进行各种操作。例如单击某个按钮等。此时浏览器将页面再次发送到Web服务器，在ASP.NET中称该过程为“PostBack”，也叫“回发”。例如用户正在访问的页面是09一月202386.1基于事件的编程模型Default.aspx，当用户单击该页面上的某个按钮后，浏览器发送到服

务器的目标还是Default.aspx。“PostBack”相当于在Web服务器上再次加载该页面，并能在页面上获取用户操作的信息。如果用户单击的是超链接而不是按钮，服务器可能仅仅将其定位到另一个页面，而不会对包含超链接的页面做进一步处理。服务器执行代码隐藏类中的代码（简称为后台代码），处理指定的操作，然后将执行操作后的页面返回给客户端浏览器。

从基本处理过程可以看出，由于页面处理发生在Web服务器上，因此页面可以执行的每个操作都需要一次“客户端服务器客户端”的往返行程。09一月202396.1基于事件的编程模型Web窗体页的生存期09一月202310阶

段说

明页请求页请求发生在页生命周期开始之前。用户请求页时，ASP.NET将确定是否需要分析和编译页（从而开始页的生命周期），或者是否可以在不运行页的情况下发送页的缓存版本以进行响应开始在开始阶段，将设置页属性，如Request和Response。在此阶段，页还将确定请求是回发请求还是新请求，并设置IsPostBack属性。此外，在开始阶段期间，还将设置页的UICulture属性页初始化（Page_Init事件）页初始化期间，可以使用页中的控件，并将设置每个控件的UniqueID属性。此外，任何主题都将应用于页。如果当前请求是回发请求，则回发数据尚未加载，并且控件属性值尚未还原为视图状态中的值加载（Page_Load事件）加载期间，如果当前请求是回发请求，则将使用从视图状态和控件状态恢复的信息加载控件属性验证（Validated事件）在验证期间，将调用所有验证程序控件的Validate方法，此方法将设置各个验证程序控件和页的IsValid属性回发事件处理如果请求是回发请求，则将调用所有事件处理程序呈现在呈现期间，视图状态将被保存到页，然后页将调用每个控件，以将其呈现的输出提供给页的Response属性的OutputStream卸载（Page_Unload事件）完全呈现页、将页发送至客户端并准备丢弃时，将调用卸载。此时，将卸载页属性（如Response和Request）并执行清理6.1基于事件的编程模型母版页和使用母版页的Web窗体页定义：母版页是指只能被其他Web窗体页作为模板来引用无法单独在浏览器中显示、扩展名为.master的特殊网页。相同点：母版页和普通的Web窗体页一样也具有一个与其对应的代码隐藏页面，不同点母版页的第1行用特殊的@Master指令标识，而普通网页则采用@Page指令标识。09一月2023116.1基于事件的编程模型母版页中，界面被分为公用区和可编辑区。可编辑区指可在引用母版页的Web窗体页中编辑的部分，它由一个或多个ContentPlaceHolder占位符控件组成。ContentPlaceHolder占位符程序员创建引用母版页的Web窗体页时，ASP.NET会自动将所引用的母版页的ContentPlaceHolder控件预留的可编辑区替换为该控件的实例。母版页和Web窗体内容页的创建方法演示创建母版页的步骤演示使用模板页的步骤09一月2023126.1基于事件的编程模型主题和外观主题ASP.NET提供了两大类型的主题，应用程序主题，保存在App_Themes文件夹下的主题文件夹。全局主题。演示创建主题的基本步骤09一月2023136.1基于事件的编程模型外观定义：外观是指保存在主题文件夹下创建的扩展名为.skin的文件中定义的Web服务器控件的属性设置的集合。分类：在.skin文件中，有两种定义的控件外观的方式，分别为“默认外观”和“已命名外观”。当向页应用主题时，默认外观自动应用于同一类型的所有控件。如果控件外观没有SkinID特性，则是默认外观09一月2023146.2界面交互控件的分类表单（form）HTML的form标记实际上是一个容器，用于通过客户端浏览器和用户的输入进行交互。例如用户输入的信息可以在<form>和</form>之间用提交按钮以及其他输入框来实现，当用户填写完信息后，单击提交按钮，即将表单内包含的内容传送到服务器，然后由服务器根据用户的输入进行相应处理，处理后再将结果返回给客户端。09一月2023156.2界面交互控件的分类HTML控件HTML控件是指基于HTML标记的控件。在HTML中，一般通过form表单中的input标记来实现与用户的交互。例如：<inputid="Button1"type="button"value="button"/>演示代码编写方式添加HTML控件的方法演示设计视图添加HTML控件的方法09一月2023166.2界面交互控件的分类HTML服务器控件将HTML元素转换为HTML服务器控件任何一个HTML元素，不论其是否在form块内，只要在元素的开始标记内添加id和runat="server"特性，就能在服务器端用C#代码访问它。例如： <divid="div1"runat="server"></div>但是这里要注意，对于和用户输入有关的控件，如果需要在服务器端处理，不论是HTML控件还是ASP.NETWeb服务器控件，都必须将其包含在<form>和</form>之间。09一月2023176.2界面交互控件的分类在代码隐藏类中使用C#动态控制页面中的HTML元素将HTML控件转化为HTML服务器控件后，便可以直接在隐藏代码类中利用控件的id直接获取HTML对象。例如HTML代码为：<inputid="age"type="text"name="age"runat="server"/></p>在代码隐藏类中，HTML的id特性的值被自动封装为属性，因此程序员可以通过age属性修改输入文本框控件的Value值：this.age.Value="20";HTML服务器控件共有的属性网页中的任何一个HTML元素，例如div、p、span等，一旦将其作为HTML服务器控件，该控件的各种特性就会在代码隐藏类中被自动公开为可以用C#对其进行操作的属性。09一月2023186.2界面交互控件的分类Web服务器控件什么情况下使用Web服务器控件当进行复杂的页面设计时，因为Web服务器控件具有比HTML元素更多的内置功能。例如导航、验证、动态数据显示、AJAX、WebParts以及数据和报表处理等。当需要在客户端动态地响应用户鼠标移动、键盘输入等交互性比较频繁的操作时，由于这些操作实时性要求比较强，不适合每个动作都在服务器端处理，可以使用ASP.NETAJAX对服务器控件进行扩展，利用JavaScript和jQuery在客户端响应用户的操作。09一月2023196.2界面交互控件的分类注意Web服务器控件与HTML服务器控件相比更为抽象，其对象模型和HTML元素不一定有一对一的关系。所有ASP.NETWeb服务器控件全部都带有“asp:”前缀。为了区分客户端控件和服务器控件，默认情况下，VS2010自动生成的HTML控件的id一律用小写字母“id”来表示，Web服务器控件的id一律用大写字母“ID”来表示。09一月2023206.3HTML控件的基本用法label标记用于为表单控件定义显示的内容，其内容一般是文本，但是也可以包含其他标记。for特性，用于和其他元素的id绑定，其作用是当用户单击该标记的内容时，光标焦点就会自动定位到它所绑定的控件上。button标记用type特性指定是哪类按钮，取值有：type="reset"：重置按钮，单击该按钮可将表单中的内容全部清除type="submit"：提交按钮，单击该按钮可以将表单中的内容提交到form元素的action特性指定的URL地址中。type="button"：普通按钮，单击该按钮会自动触发onclick事件。09一月2023216.3HTML控件的基本用法

button标记：特殊用法：可以包含元素内容，所以可用它来实现一些特殊的功能，比如同时显示图像和文字：<buttonid="button1"type="submit"style="text-align:center;"> <imgsrc="av.png"alt=""/>修改姓名</button>注意由于不同的浏览器对button标记的默认type类型并不完全相同，所以使用button标记来表示按钮时，一定要指定其type特性，否则有可能得不到预期的结果。09一月2023226.3HTML控件的基本用法

input标记按钮input标记利用type特性指定是哪类按钮，其取值和button标记的type取值相同，即type="reset"表示重置按钮，type="submit"表示提交按钮，type="button"表示普通按钮。例如： <inputid="button1"type="button"value="确定"/>文本框及密码框（input、textarea）单行文本框当input标记的type="text"时，表示控件为单行文本输入框。例如：<label>用户名：<inputid="Text1"type="text"value="张三"maxlength="10"/></label>09一月2023236.3HTML控件的基本用法

密码框当input标记的type="password"时，表示该标记为密码输入框。密码输入框与单行文本输入框的功能基本一致，不同的是当用户输入密码时，密码框中的文本显示的是同一个字符。例如：<inputid="Password1"type="password"value=”12345”/>多行文本框在HTML中，用textarea标记表示多行文本域，用于多行文本输入。例如：<textareastyle="height:60px;width:300px;"></textarea>09一月2023246.3HTML控件的基本用法

列表和下拉列表（select、option）HTML的select标记和option标记配合使用，可以用来定义列表项。例如：<div>请选择专业：<selectid="LanguageSelect"><option>计算机科学与技术</option><optionselected="selected">网络工程</option><option>软件工程</option></select></div>09一月2023256.3HTML控件的基本用法容器（div、fieldset、legend）容器的用途是可以方便地控制多个元素，例如只需要控制容器的显示和隐藏，就能控制该容器所包含的所有元素全部显示或不显示。在客户端实现中，一般使用div作为容器，也可以用fieldset作为容器，例如：<fieldset><legend>个人信息</legend><br/>

姓名：<inputtype="text"size="30"/><br/>

地址：<inputtype="text"size="30"/><br/></fieldset>09一月2023266.3HTML控件的基本用法单选按钮单选按钮的用途是给用户提供一组选项，在这些选项中，每次只能有一项被选中。当input标记的type="radio"时，表示该标记为单选按钮。checked属性：

同一组按钮的name相同，设置checked="checked"可以让按钮处于选中状态。09一月2023276.3HTML控件的基本用法复选框（input）当input标记的type="checkbox"时，表示该标记为复选框，复选框提供多选功能。用户需要从若干给定的选择中选取一个或多个选项时，可以使用复选框控件。例如：<label>爱好：<inputid="item1"type="checkbox"/>兵乓球</label><label><inputid="item2"type="checkbox"checked="checked"/>游泳</label><label><inputid="item3"type="checkbox"checked="checked"/>羽毛球</label>09一月2023286.3HTML控件的基本用法文件选择对话框当input标记的type="file"时，表示该标记为文件选择框。例如：

<inputid="File1"type="file"/>这段代码在浏览器上显示的效果下图所示。使用文件选择框时，还可以利用accept特性指定提交的文件类型（mime_types），该特性仅适用于type="file"。09一月2023296.3HTML控件的基本用法隐藏域当input标记的type="hidden"时，表示该标记为隐藏域，隐藏域在页面不可见。可以用来保存一些不让用户在页面中看到的数据例如： <inputtype="hidden"id="Hidden1"value="123"/>09一月2023306.4基本Web服务器控件

标签和按钮Button控件该控件为普通按钮。例如：<asp:ButtonID="Button1"runat="server"Text="按钮1"/>LinkButton控件LinkButton控件是以超链接形式显示的按钮，其外观与超链接标记相同，但功能与Button控件相同。例如：<asp:LinkButtonID="LinkButton1"runat="server"Height="27px"Width="190px">LinkButton按钮</asp:LinkButton>09一月2023316.4基本Web服务器控件

ImageButton控件ImageButton控件:是以图片形式显示的按钮。ImageUrl：指定所要显示的图片。Click事件:提供单击控件中的图形区域时，所单击的坐标位置。Button控件、LinkButton控件和ImageButton控件除了外观显示形式不一样以外，其他用法完全相同。注意：Button控件有一个OnClientClick属性（避免和服务器的单击事件重复）。当用户单击按钮控件时，将首先触发客户端的onclick事件，而后触发服务器端的Click事件。在【设计】视图下，双击某个Button控件，即注册了该控件的服务器端Click事件。09一月2023326.4基本Web服务器控件

文本框及密码框（TextBox）TextBox控件的常用属性和事件:09一月202333属

性含

义ID属性指定控件的名称，它是控件在页面中的唯一标识，代码通过该属性来访问控件AutoPostBack属性决定控件中文本内容修改后，是否自动回发到服务器，默认值为false，即修改文本后并不立即回发到服务器，而是等页面被提交后一并处理。若修改该属性值为true，则每次更改文本框的内容并且焦点离开控件时，都会自动回发，使服务器处理控件相应的TextChanged事件TextMode属性设置文本框接受文本的行为模式。该属性共有3种属性值：MultiLine（多行输入模式）、Password（密码输入模式）、SingleLine（单行输入模式）。默认值为SingleLineMaxLength属性获取或设置文本框中最多允许输入的字符数Text属性设置控件上所要显示的文本TextChanged事件文本框中的内容发生更改且页面回传到服务器端处理时触发的事件。注意，是否触发该事件与AutoPostBack属性有关。若AutoPostBack属性设置为true，当该控件失去焦点时，更改文本框中的内容都会使页面回传到服务器端，并同时触发TextChanged事件6.4基本Web服务器控件

列表和下拉列表（ListBox、DropDownList）AutoPostBack属性决定控件选中项发生变化后，是否自动回发到服务器。Items属性用于编辑控件中所要显示的列表项。SelectionMode属性用于指定ListBox控件每次可以选择一个或多个。SelectedIndexChanged事件当选定项发生更改时触发该事件。09一月2023346.4基本Web服务器控件

单选按钮（RadioButton、RadioButtonList）用RadioButton控件显示单选按钮RadioButtonList控件该控件封装了一组单选按钮控件的列表控件。注意Web窗体会将同一容器中的所有RadioButton控件视为不同的组，可以多选。若要将多个RadioButton控件作为一组互斥的控件使用，需要让这些RadioButton控件具有相同的GroupName属性。09一月2023356.4基本Web服务器控件

复选框（CheckBox、CheckBoxList）CheckBoxList是一组复选框的集合。CheckBox服务器控件适合用在选项不多且比较固定的情况，当选项比较多时，或者在运行时动态地决定有哪些选项时，使用CheckBoxList控件比较方便。CheckBox控件的常用属性和事件：09一月202336属

性含

义Text属性显示在复选框右侧的内容Value属性描述选项的值Checked属性选中为True，未选中为FalseAutoPostBack属性决定CheckBox控件状态更改后是否自动回传到服务器处理。该属性默认值为false，即选中状态更改后并不立即回传到服务器。若修改该属性值为true，则每次更改CheckBox控件状态时，都自动回传，使服务器触发CheckBox控件的CheckedChanged事件CheckedChanged事件复选框选中状态发生改变时触发6.4基本Web服务器控件

容器控件（Panel、Literal、view、MultiView）Panel控件Panel控件在Web窗体页内提供了一种容器控件，可以将它用作其他控件的父级元素。对控件和标记进行分组

对于一组控件和相关的标记，可通过把其放置在Panel控件中，然后将此Panel控件中的内容作为一个单元进行管理。具有默认按钮的窗体

可将TextBox控件和Button控件放置在Panel控件中，通过Panel控件的【DefaultButton】属性设置默认按钮。用户在面板内的文本框中按<Enter>键，将与用户单击默认按钮具有相同的效果。09一月2023376.4基本Web服务器控件

动态生成控件的容器Panel控件为在运行时创建的控件提供了一个方便使用的容器。页上的自定义区域Panel控件在页上创建具有自定义外观和行为的区域，作用如下添加滚动条。创建一个带标题的分组框。注意如果在Panel控件中同时指定滚动条和分组文本，则只会显示分组框，而不会显示滚动条。另外，如果设置了Panel控件的【GroupingText】属性，panel边框的定义和用fieldset及legend标记组合产生的边框的定义含义不相同。09一月2023386.4基本Web服务器控件

Literal控件Literal控件可使得文本和控件直接呈现在页面中时。该Mode属性取值：Encode：对Text属性值所包含的特殊符号进行HTML编码，将其转换为纯文本表示形式。PassThrough：不对Text属性值进行HTML编码。例如“<div>abc</div>”将直接发送到客户端，由于在浏览器中<div>和</div>被解释为div标记，其实际效果就是直接显示div元素的内容“abc”。Transform：如果客户端是浏览器，此属性的功能与PassThrough相同。此功能主要用于目标不是浏览器的场合。09一月2023396.4基本Web服务器控件

View控件与MultiView控件根据用户选择或其他条件提供不同的页面。例如可能允许用户从一个列表中选择，其中每个项都有独立的View控件与之对应。然后可以显示用户选择的View控件里面的内容。可以使用View控件和MultiView控件作为创建多个Panel控件的一种替代方法。创建多页窗体。View控件和MultiView控件可以提供与Wizard控件相似的行为。Wizard控件尤其适合于创建用户分步骤操作的窗体。09一月202340基本Web服务器控件图像显示和区域控制（Image、ImageMap）Image控件:在ASP.NET网页上显示图像<asp:ImageID="Image1"runat="server"ImageUrl="图片URL地址"/>注意:Image控件不响应鼠标单击事件。实际应用中，可以通过使用ImageMap或ImageButton控件来创建交互式图像。09一月202341基本Web服务器控件ImageMap控件创建一个能与用户交互的图像，该图像包含许多用户可以单击的区域，这些区域被称为热点区域。当用户需要对一幅图片的某个局部范围进行操作时，需要使用ImageMap控件。例如：一个旅游地点的全景图，可以将全景图划分为几个热点区域，当鼠标在热点区域A内单击，则页面转向景点A的的URL地址，在热点区域B内单击，则转向景点B的URL地址。HotSpotMode属性09一月20234209一月2023436.5ASP.NET内置对象与状态管理ASP.NET提供的APIASP.NET提供了非常多的类，这些类分布在不同的命名空间下，供Web开发人员使用。ASP.NET提供的与用户界面相关的API命名空间说

明System.Web.UI提供创建ASP.NETWeb应用程序用户界面的服务器控件和网页的类和接口。System.Web.UI.DataVisualization.Charting包含ChartWeb服务器控件的类System.Web.UI.Design.WebControls包含可用于扩展Web服务器控件设计时支持的类System.Web.UI.Design.WebControls.WebParts包含为从该命名空间中的类派生的控件提供设计时支持的类System.Web.UI.HtmlControls包含可在Web窗体页上创建HTML服务器控件的类集合。System.Web.UI.WebControls包含可在网页上创建Web服务器控件的类。System.Web.UI.WebControls.WebParts包含集成在一起的一组类和接口，可用于创建网页Page类及其扩充类Page类提供的常用属性和方法常用属性和方法说

明IsPostBack属性获取一个值，该值指示页是第一次呈现（false）还是为了响应回发而加载（true）ClientID属性获取由ASP.NET生成的HTML标记的控件IDPreviousPage属性获取向当前页传输控件的页Request属性获取请求的页的HttpRequest对象Response属性获取与该Page对象关联的HttpResponse对象Server属性获取HttpServerUtility类的实例，该属性提供对常用的HtmlEncode和MapPath方法的访问ViewState属性获取当前页的视图状态对象Session属性获取ASP.NET提供的当前Session对象Application属性为当前Web请求获取HttpApplicationState对象Cache属性获取与该页驻留的应用程序关联的Cache对象Context属性获取与该页关联的HttpContext对象User属性取有关发出页请求的用户的信息FindControl方法Page类及其扩充类HttpRequest对象在代码隐藏类中，通过当前页的Request属性可获取HttpRequest对象HttpResponse对象用于管理输出到客户端的信息。通过当前页的Response属性可获取HttpResponse对象。HttpServerUtility对象网页提供对编码、解码等方法的访问。通过当前页的Server属性可获取HttpServerUtility对象。HttpContext对象通过Page.Context属性可获取与该页关联的HttpContext对象。ASP.NET状态管理基于客户端的状态管理选项基于客户端的状态管理选项只在页中或客户端计算机上存储信息。对于这些选项，在各往返行程间不会在服务器上维护任何信息ViewState对象

ViewState对象是页面公开的字典对象，可以保存各种数据类型Cookie对象

Cookie对象一般用于在客户端保存一些针对某个用户的信息Cookie本质上只是一小段文本字符串，该字符串一般保存在用户计算机特定文件夹下的某个文件中，每个Cookie都保存到一个对应的文件中。ASP.NET状态管理基于服务器的状态管理选项基于服务器的状态管理选项只在服务器上存储信息。Session对象在服务器内存中为每个用户分别分配一段内存空间来保存数据，并用SessionID来区分是哪个客户。开发人员可以定义、修改、释放每个用户Session集合中的一个或多个Session对象。Application对象

Page类的Application属性用于获取HttpApplicationState对象HttpApplicationState类主要用于提供在整个应用程序中共享的信息。09一月202347ASP.NET配置appSettings用于统一为应用程序定义一些全局常量

strings=System.Configuration.ConfigurationManager.AppSettings["message"]connectionStrings用于配置数据库连接字符串。 strings=System.Configuration.ConfigurationManager.ConnectionStrings["testmdf"].ConnectionString;system.webcompilation属性和authentication属性。调试程序时，一般将compilation