Download presentation
Presentation is loading. Please wait.
1
第3章 ASP.NET程序设计基础 3
2
内容提要 ASP.NET支持三种控件:Web服务器端控件、HTML 服务器端控件和用户自定义控件。
Web服务器端控件是.NET推荐使用的控件,Web服务器端控件除了常用的输入输出控件以外,还包括验证控件。
3
理解服务器端控件 案例名称:服务器端动态页面 程序名称: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>
4
ASP.NET页面的处理过程 当用户通过客户端浏览器发出一个对ASP.NET页面的请求后,Web服务器交由ASP.NET引擎来处理。ASP.NET引擎会先检查输出缓冲中是否有此页面或此页面是否已经被编译成dll(Dynamic Link Library,动态链接库)文件。若在输出缓冲中找不到此页面或找不到编译过的dll文件,则将此页面转换成源程序代码,然后由编译器将其编译成dll文件。 如果找到了编译过的dll文件,则省略了编译的步骤,而是直接利用编译过的dll文件建立对象,将执行结果返回到客户端浏览器。所以在执行的时候,ASP.NET文件第一次被调用的时候非常慢,但是以后调用就很快。
5
页面的事件 比较常用的页面事件为: Page_Load():在页面被加载的时候,自动调用该事件。
控件事件:由用户在客户端浏览器上触发的各种事件。 Page_Unload():当页面从内存中被卸载的时候,自动调用该事件。
6
案例名称:判断用户页面是否被提交过 程序名称: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>
7
页面指示符 指示符 说明 @Page 定义页面特性,只能在.aspx文件中 @Control 定义用户控件特性。只能在.ascx文件中
@Import 导入名字空间,使用名字空间中定义的类 @Implements 指定当前页面实现的.NET框架接口 @Register 用来注册用户控件 @Assembly 用来引用.NET组件 @OutputCache 用来设置输出缓冲的特性 @Reference 定义当前页运行时要动态编译和连接的页面和用户控件
8
HTML服务器端控件
9
HtmlAnchor控件 案例名称:HtmlAnchor控件 程序名称:3-03.aspx
Page Language="C#" %> <script language="C#" runat="server"> void Page_Load(object sender, EventArgs e) { anchor1.InnerText="北京大学"; anchor1.HRef=" anchor1.Target="_blank"; // 在新的无标题窗口加载链接 } </script> <a id="anchor1" runat="server"></a>
10
HtmlImage控件 案例名称:HtmlImage控件 程序名称:3-04.aspx
Page Language="C#" %> <form runat="server"> <img id="imgsixAge" src="myimage.jpg" width ="300" height="200" runat="server"/> </form>
11
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>";
12
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控件
13
Web 服务器端控件
14
文本、标签和图像控件 案例名称:使用文本、标签 程序名称: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>
15
案例名称:使用图像 程序名称:3-08.aspx <form runat="server"> <asp:Image id="stars" runat="server" ImageAlign="left" width="300" height="200" ImageUrl="myimage.jpg"/> </form>
16
超级链接 案例名称:超级链接 程序名称:3-09.aspx <asp:HyperLink id="hyperLink1"
<asp:HyperLink id="hyperLink1" ImageUrl="bjtu.jpg" NavigateUrl=" Text="北京交通大学出版社" Target="_blank" runat="server"/> </body>
17
下拉列表控件 案例名称:下拉列表控件 程序名称: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>
18
案例名称:列表控件 程序名称: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
19
案例名称:单选框和复选框 程序名称: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>
20
案例名称:表格控件 程序名称: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>
21
文本控件 案例名称:Literal控件 程序名称:3-14.aspx <form runat="server">
<form runat="server"> <asp:Literal id="Literal1" Text="我是中国人,我深爱着自己的祖国!" runat="server"/> </form>
22
容器控件 案例名称: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>
23
广告栏控件和日历控件 AdRotator控件用于制作广告条。AdRotator控件在每次打开或重新加载网页时在页面上放置一幅新的广告。
显示的广告取决于AdRotator配置文件。AdRotator配置文件。该文件是一个XML格式的文件,包含显示图像和链接信息显示频率
24
验证控件简介 控件名 功能描叙 RequiredFieldValidator(必须字段验证) 用于检查是否有输入值
CompareValidator(比较验证) 按设定比较两个输入 RangeValidator(范围验证) 输入是否在指定范围 RegularExpressionValidator(正则表达式验证) 正则表达式验证控件 CustomValidator(自定义验证) 自定义验证控件 ValidationSummary(验证总结) 总结验证结果
25
必须字段验证控件 案例名称:必须字段验证控件 程序名称: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>
26
比较验证控件 案例名称:比较验证控件 程序名称: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>
27
范围验证控件 案例名称:范围验证控件 程序名称: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>
28
正则表达式匹配验证 案例名称:正则表达式匹配验证 程序名称:3-22.aspx
Page clienttarget=downlevel Language="C#" %> <form runat="server"> <b>请数字开头后接一个大写字母:</b> <asp:TextBox id=" " runat="server" /> <asp:Button text="验证" runat=server /><br> <asp:RegularExpressionValidator id="rev" ControlToValidate=" " ValidationExpression="\d[A-Z]*" Display="Dynamic" runat="server"> 输入错误 </asp:RegularExpressionValidator> </form>
29
验证总结控件 案例名称:验证总结控件 程序名称: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> 验证总结控件
30
自定义控件 </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>
31
用户控件的编写方法 案例名称:用户自定义控件 程序名称: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" />
32
用户控件实现注册界面 案例名称:利用自定义控件实现用户注册 程序名称:3-27.ascx
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"/>
33
利用自定义控件实现用户注册 案例名称:利用自定义控件实现用户注册 程序名称:3-28.aspx
Register TagPrefix="ucasp" TagName="Login" Src="login.ascx" %> <form runat="server"> <ucasp:Login id="Login1" runat="server"/> </form>
34
服务器端控件的动态数据绑定 ASP.NET支持服务器端的数据绑定,数据绑定表达式的语法是:
<% # databinding expression %>
35
数据绑定 案例名称:数据绑定 程序名称: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>
36
小结 本章作为ASP.NET的控件篇,整体介绍了Web 服务器端控件、HTML 服务器控件的使用方法。验证控件是一类特殊的Web服务器端控件,使用比较广泛。最后介绍了用户自定义控件和服务器端绑定的基本概念和使用方法。
37
本章习题 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文件改成一个用户自定义控件。(上机完成)
Similar presentations