第3章 ASP.NET程序设计基础 3

内容提要 ASP.NET支持三种控件：Web服务器端控件、HTML 服务器端控件和用户自定义控件。 Web服务器端控件是.NET推荐使用的控件，Web服务器端控件除了常用的输入输出控件以外，还包括验证控件。

理解服务器端控件 案例名称：服务器端动态页面 程序名称：3-01.aspx <% @ Page Language="C#" %>   <% @ Page Language="C#" %> <script language="C#" runat="server"> protected void Button_Click(object sender, EventArgs e){ Message.Text = "你的名字是：" + Name.Text; } </script> <form method="post" runat="server"> 姓名：<asp:textbox id="Name" runat="server" /> <asp:button text="确定" onclick="Button_Click" runat="server" /> <br><br><br> <asp:label id="Message" runat="server" /> </form>

ASP.NET页面的处理过程 当用户通过客户端浏览器发出一个对ASP.NET页面的请求后，Web服务器交由ASP.NET引擎来处理。ASP.NET引擎会先检查输出缓冲中是否有此页面或此页面是否已经被编译成dll（Dynamic Link Library，动态链接库）文件。若在输出缓冲中找不到此页面或找不到编译过的dll文件，则将此页面转换成源程序代码，然后由编译器将其编译成dll文件。 如果找到了编译过的dll文件，则省略了编译的步骤，而是直接利用编译过的dll文件建立对象，将执行结果返回到客户端浏览器。所以在执行的时候，ASP.NET文件第一次被调用的时候非常慢，但是以后调用就很快。

页面的事件 比较常用的页面事件为： Page_Load()：在页面被加载的时候，自动调用该事件。 控件事件：由用户在客户端浏览器上触发的各种事件。 Page_Unload()：当页面从内存中被卸载的时候，自动调用该事件。

案例名称：判断用户页面是否被提交过 程序名称：3-02.aspx   <% @ Page Language="C#" %> <script language="C#" runat="server"> protected void Page_Load(Object sender, EventArgs e){ if (!IsPostBack) { lblMessage.Text = "第一次访问！"; } else{ lblMessage.Text = "页面被提交了！"; void SubmitBtn_Click(Object sender, EventArgs e) { </script> <form runat=server> <asp:button id="btnSubmit" Text="提交" OnClick="SubmitBtn_Click" runat="server" /> <asp:Label id="lblMessage" runat="server"/> </form>

页面指示符 指示符 说明 @Page 定义页面特性，只能在.aspx文件中 @Control 定义用户控件特性。只能在.ascx文件中 @Import 导入名字空间，使用名字空间中定义的类 @Implements 指定当前页面实现的.NET框架接口 @Register 用来注册用户控件 @Assembly 用来引用.NET组件 @OutputCache 用来设置输出缓冲的特性 @Reference 定义当前页运行时要动态编译和连接的页面和用户控件

HTML服务器端控件

HtmlAnchor控件 案例名称：HtmlAnchor控件 程序名称：3-03.aspx   <% @ Page Language="C#" %> <script language="C#" runat="server"> void Page_Load(object sender, EventArgs e) { anchor1.InnerText="北京大学"; anchor1.HRef="http://www.pku.edu.cn"; anchor1.Target="_blank"; // 在新的无标题窗口加载链接 } </script> <a id="anchor1" runat="server"></a>

HtmlImage控件 案例名称：HtmlImage控件 程序名称：3-04.aspx   <% @ Page Language="C#" %> <form runat="server"> <img id="imgsixAge" src="myimage.jpg" width ="300" height="200" runat="server"/> </form>

HtmlInput控件 案例名称：调查表 程序程序：3-05.aspx <% @ Page Language="C#" %>   <% @ Page Language="C#" %> <script language="C#" runat="server"> void SubmitBtn_Click(Object sender, EventArgs e) { Message.InnerHtml="<h4>您输入的个人信息是:</h4>"; Message.InnerHtml+="<b>姓名</b>："+Name.Value+"<br>";

HtmlInputFile控件 案例名称：实现文件上传 程序名称：3-06.aspx   <% @ Page Language="C#" %> <script language="C#" runat="server"> void UploadBtn_Click(Object sender,EventArgs e){ if (UpFile.PostedFile!=null) { // 显示上传文件的文件名、文件类型和文件大小 FileName.InnerHtml=UpFile.PostedFile.FileName; FileType.InnerHtml=UpFile.PostedFile.ContentType; FileLength.InnerHtml=UpFile.PostedFile.ContentLength.ToString(); FileDetails.Visible=true; //取文件名 string myDir=UpFile.PostedFile.FileName; int mypos=myDir.LastIndexOf("\\"); string myFileName=myDir.Substring(mypos); // 保存上传的文件 string mySavePath=Server.MapPath(".")+ myFileName; SaveDir.InnerHtml=mySavePath; UpFile.PostedFile.SaveAs(mySavePath); } </script> <form method="post" enctype="multipart/form-data" runat="server"> 选择要上传的文件: <input id="UpFile" type="file" runat="server"> <input type=submit value="上传" OnServerclick="UploadBtn_Click" runat="server"><br><br> <div id="FileDetails" Visible=false runat="server"> <b>原文件名:</b><span id="FileName" runat="server"/><br> <b>上传到服务器:</b><span id="SaveDir" runat="server"/><br> <b>文件类型:</b><span id="FileType" runat="server"/><br> <b>文件大小:</b><span id="FileLength" runat="server"/>字节<br> </div></form> HtmlInputFile控件

Web 服务器端控件

文本、标签和图像控件 案例名称：使用文本、标签 程序名称：3-07.aspx   <% @ Page Language="C#" %> <script language="C#" runat="server"> void txtUid_TextChanged(Object sender, EventArgs e){ lblUid.Text = txtUid.Text; } </script> <form runat="server"> <b>用户名:</b> <asp:TextBox id="txtUid" OnTextChanged="txtUid_TextChanged" runat="server"/><br> <b>您的用户名为:</b> <asp:Label id="lblUid" runat="server"/> </form>

案例名称：使用图像 程序名称：3-08.aspx   <form runat="server"> <asp:Image id="stars" runat="server" ImageAlign="left" width="300" height="200" ImageUrl="myimage.jpg"/> </form>

超级链接 案例名称：超级链接 程序名称：3-09.aspx <asp:HyperLink id="hyperLink1"   <asp:HyperLink id="hyperLink1" ImageUrl="bjtu.jpg" NavigateUrl="http://press.bjtu.edu.cn/" Text="北京交通大学出版社" Target="_blank" runat="server"/> </body>

下拉列表控件 案例名称：下拉列表控件 程序名称：3-10.aspx <% @ Page Language="C#" %>   <% @ Page Language="C#" %> <script language="C#" runat="server"> void Image_Changed(Object Sender, EventArgs e) { lblUid.Text = lstAddr.SelectedItem.Value; } </script> <form runat="server"> 选择你要去的城市： <asp:DropDownList id="lstAddr" AutoPostBack="True" OnSelectedIndexChanged="Image_Changed" runat="server"> <asp:ListItem value="北京" selected="true">北京</asp:ListItem> <asp:ListItem value="上海">上海</asp:ListItem> </asp:DropDownList> <asp:Label id="lblUid" runat="server"/> </form>

案例名称：列表控件 程序名称：3-11.aspx   <% @ Page Language="C#" %> <script language="C#" runat="server"> protected void Page_Load(Object sender, EventArgs e){ // 若是第一次访问，则往列表框中填充数据 if (!IsPostBack) { this.Loves.Items.Add(new ListItem("唱歌","Singing")); this.Loves.Items.Add(new ListItem("跳舞","Dancing")); this.Loves.Items.Add(new ListItem("划船","bowing")); this.Loves.Items.Add(new ListItem("睡觉","Sleeping")); } void SubmitBtn_Click(Object sender, EventArgs e) { string s="我的爱好是："; for (int i=0;i<Loves.Items.Count;i++) { if (Loves.Items[i].Selected) { s+=Loves.Items[i].Text+"  "; Label1.Text=s; </script><form runat=server> 你的爱好列表为：<br> <asp:ListBox id="Loves" Rows="5" Width="100px" SelectionMode="Multiple" runat="server"> </asp:ListBox> <asp:button id="Submit" Text="提交" OnClick="SubmitBtn_Click" runat="server" /> <asp:Label id="Label1" Font-Name="Verdana" Font-Size="10pt" runat="server"/> </form

案例名称：单选框和复选框 程序名称：3-12.aspx   <% @ Page Language="C#" %> <script language="C#" runat="server"> void SubmitBtn_Click(Object sender, EventArgs e) { Message.Text="<h4>您的性别和爱好是:</h4>"; if (Male.Checked) Message.Text+="<b>性别</B>：男<br>"; if (Female.Checked) Message.Text+="<b>性别</B>：女<br>"; Message.Text+="<b>爱好：</b>"; if(Football.Checked) Message.Text+="足球  "; if(Tour.Checked) Message.Text+="旅游  "; if(Chess.Checked) Message.Text+="围棋  "; } </script>

案例名称：表格控件 程序名称：3-13.aspx   <% @ Page Language="C#" %> <script language="C#" runat="server"> void Page_Load(Object sender, EventArgs e) { // 从选择列表获得行数 int numrows = Convert.ToInt32(TabRows.SelectedItem.Text); // 从选择列表获得列数 int numcells = Convert.ToInt32(TabCells.SelectedItem.Text); // 动态生成表格行和列 for (int j=0; j<numrows; j++) { TableRow r=new TableRow(); for (int i=0; i<numcells; i++) { TableCell c=new TableCell(); c.Controls.Add(new LiteralControl("行"+j.ToString()+",列"+i.ToString())); r.Cells.Add(c); } DyTab.Rows.Add(r); </script> <h3><font face="Verdana">动态生成表格</font></h3> <form runat="server"> <asp:Table id="DyTab" CellPadding=5 CellSpacing=0 Border="1" BorderColor="black" runat="server" /> <p> 行数: <asp:DropDownList id="TabRows" runat="server"> <asp:ListItem>1</asp:ListItem> <asp:ListItem>2</asp:ListItem> <asp:ListItem>3</asp:ListItem> <asp:ListItem>4</asp:ListItem> <asp:ListItem>5</asp:ListItem> </asp:DropDownList> <br> 列数: <asp:DropDownList id="TabCells" runat="server"> <asp:Button Text="创建" runat="server"/> </form>

文本控件 案例名称：Literal控件 程序名称：3-14.aspx <form runat="server">   <form runat="server"> <asp:Literal id="Literal1" Text="我是中国人，我深爱着自己的祖国！" runat="server"/> </form>

容器控件 案例名称：PlaceHolder控件 程序名称：3-15.aspx   <% @ Page Language="C#" %> <script language="C#" runat="server"> void Page_Load(Object sender, EventArgs e){ Literal literal1=new Literal(); literal1.Text="<b>你好！</b>"; PlaceHolder1.Controls.Add(literal1); Button button1=new Button(); button1.Text="按钮"; PlaceHolder1.Controls.Add(button1); } </script> <form runat="server"> <asp:PlaceHolder id="PlaceHolder1" runat="server"/> </form>

广告栏控件和日历控件 AdRotator控件用于制作广告条。AdRotator控件在每次打开或重新加载网页时在页面上放置一幅新的广告。 显示的广告取决于AdRotator配置文件。AdRotator配置文件。该文件是一个XML格式的文件，包含显示图像和链接信息显示频率

验证控件简介 控件名 功能描叙 RequiredFieldValidator（必须字段验证） 用于检查是否有输入值 CompareValidator（比较验证） 按设定比较两个输入 RangeValidator（范围验证） 输入是否在指定范围 RegularExpressionValidator（正则表达式验证） 正则表达式验证控件 CustomValidator（自定义验证） 自定义验证控件 ValidationSummary（验证总结） 总结验证结果

必须字段验证控件 案例名称：必须字段验证控件 程序名称：3-19.aspx   <%@ Page clienttarget=downlevel Language="C#" %> <Form RunAt="Server"> <ASP:TextBox id="txtName" RunAt="Server"/> <ASP:RequiredFieldValidator id="Validator1" Runat="Server" ControlToValidate="txtName" ErrorMessage="姓名必须输入" Display="Static"> *姓名必须输入 </ASP:RequiredFieldValidator> </Form>

比较验证控件 案例名称：比较验证控件 程序名称：3-20.aspx   <%@ Page clienttarget=downlevel Language="C#" %> <form runat="server"> <b>密码1:</b> <asp:TextBox id="passwd1" TextMode="Password" runat="server" /> <br><b>密码2:</b> <asp:TextBox id="passwd2" TextMode="Password" runat="server" /> <asp:CompareValidator id="CV" ControlToValidate="passwd1" ControlToCompare="passwd2" Type="String" Operator="Equal" Display="static" runat="server"> 两者不一致！ </asp:CompareValidator> <br><br><asp:Button id="Validate" text="验证" runat=server /> </form>

范围验证控件 案例名称：范围验证控件 程序名称：3-21.aspx   <%@ Page clienttarget=downlevel Language="C#" %> <form runat="server"> <b>请输入1-6选项中的一项：</b> <asp:TextBox id="Choice" runat="server" /> <asp:Button text="验证" runat=server /><br> <asp:RangeValidator id="rv" ControlToValidate="Choice" MinimumValue="1" MaximumValue="6" ErrorMessage="输入必须是1-6之间的整数" Type="Integer" Display="dynamic" runat="server"> </asp:RangeValidator> </form>

正则表达式匹配验证 案例名称：正则表达式匹配验证 程序名称：3-22.aspx   <%@ Page clienttarget=downlevel Language="C#" %> <form runat="server"> <b>请数字开头后接一个大写字母：</b> <asp:TextBox id="Email" runat="server" /> <asp:Button text="验证" runat=server /><br> <asp:RegularExpressionValidator id="rev" ControlToValidate="Email" ValidationExpression="\d[A-Z]*" Display="Dynamic" runat="server"> 输入错误 </asp:RegularExpressionValidator> </form>

验证总结控件 案例名称：验证总结控件 程序名称：3-23.aspx   <%@ Page clienttarget=downlevel Language="C#" %> <h2>请填写您的个人信息：</h2><hr> <form runat="server"> <b>姓名:</b> <asp:TextBox id="Name" MaxLength="20" runat="server" /> <asp:RequiredFieldValidator id="rfv1" ControlToValidate="Name" ErrorMessage="姓名不能为空" Display="Static" runat=server>* </asp:RequiredFieldValidator> <br><b>性别:</b> <asp:RadioButtonList id="Sex" RepeatLayout="Flow" RepeatDirection="Horizontal" runat="server"> <asp:ListItem>男</asp:ListItem> <asp:ListItem>女</asp:ListItem> </asp:RadioButtonList> <asp:RequiredFieldValidator id="rfv2" ControlToValidate="Sex" ErrorMessage="没有选择性别" <asp:Button id="Submit" Text="提交" <asp:ValidationSummary id="vs" DisplayMode="BulletList" HeaderText="必须做以下输入或选择:" </form> 验证总结控件

自定义控件 </form> 案例名称：自定义控件 程序名称：3-24.aspx   <%@ Page clienttarget=downlevel Language="C#" %> <script Language="C#" runat="server"> void ServerValidation(object source, ServerValidateEventArgs args){ try { int i=int.Parse(args.Value); args.IsValid=((i%2)==1); } catch { args.IsValid = false; </script><form runat="server"> <asp:Label id="Message" runat="server" Text="请输入奇数:" Font-Name="Verdana" Font-Size="10pt" /> <p> <asp:TextBox id="txtOdd" runat="server" /> <asp:CustomValidator id="cv" ControlToValidate="txtOdd" OnServerValidate="ServerValidation" ErrorMessage="不是奇数!" Display="Static" runat="server"/> <p> <asp:Button id="Button1" Text="验证" runat="server"/> </form>

用户控件的编写方法 案例名称：用户自定义控件 程序名称：3-25.ascx <p>用户自定义控件</p>   <p>用户自定义控件</p> 案例名称：用户控件 程序名称：3-26.aspx   <%@ Page Language="C#" %> <%@ Register TagPrefix="myCo" TagName="myTxt" Src="3-25.ascx" %> <myCo:myTxt runat="server" />

用户控件实现注册界面 案例名称：利用自定义控件实现用户注册 程序名称：3-27.ascx   <% @Control className="UcLogin" %> <script language="C#" runat="server"> void RegBtn_Click(Object sender, EventArgs e){ Message.Text = "<br>"; Message.Text += "<b>用户名是:</b>"+Name.Text+"<br>"; Message.Text += "<b>密码是:</b>"+Pass.Text+"<br>"; } </script> <b>用户名:</b><ASP:TextBox id="Name" runat="server"/> <b>密码:</b> <ASP:TextBox id="Pass" TextMode="Password" runat="server"/> <ASP:Button Text="注册" OnClick="RegBtn_Click" runat="server"/> <ASP:Label id="Message" runat="server"/>

利用自定义控件实现用户注册 案例名称：利用自定义控件实现用户注册 程序名称：3-28.aspx   <%@ Register TagPrefix="ucasp" TagName="Login" Src="login.ascx" %> <form runat="server"> <ucasp:Login id="Login1" runat="server"/> </form>

服务器端控件的动态数据绑定 ASP.NET支持服务器端的数据绑定，数据绑定表达式的语法是： <% # databinding expression %>

数据绑定 案例名称：数据绑定 程序名称：3-29.aspx <%@ Page Language="C#" %>   <%@ Page Language="C#" %> <script language="C#" runat="server"> DateTime t=DateTime.Now; void Page_load(Object sender, EventArgs e){ Page.DataBind(); } </script> <form id="nform" runat="server"> 目前的日期及时间：<asp:Label id="NowTime" runat="server" Text=<%# t %>/><p> <p></form>

小结 本章作为ASP.NET的控件篇，整体介绍了Web 服务器端控件、HTML 服务器控件的使用方法。验证控件是一类特殊的Web服务器端控件，使用比较广泛。最后介绍了用户自定义控件和服务器端绑定的基本概念和使用方法。

本章习题 3-1 什么是服务器端控件，服务器端控件是如何分类的？ 3-2 简述ASP.NET页面的处理过程，为什么第一次执行的时候，ASP.NET程序执行很慢？ 3-3 如何判断页面是第一次被加载执行？ 3-4 在.NET中，如何实现文件上传？（上机完成） 3-5 简述Web服务器端控件和HTML服务器端控件的相同点和不同点。 3-6 如何将一个ASP.NET文件改成一个pagelets文件，将3-01.aspx文件改成一个用户自定义控件。（上机完成）