ASPNET__3服务器端控件(1)

WEB应用程序设计(ASP.NET)安徽机电职业技术学院信息工程系汪学文[e-mail]2013年3月课程网站：服务器端控件本课要点：了解和使用各种服务器控件使用文本框、列表框等标准控件输入数据使用验证控件确保输入数据的正确性使用文件上传控件、日历控件等Rich控件了解导航控件和用户控件的使用本课示例请参见课件文件夹下AspDotNet\Lesson3_1文件夹，虚拟目录配置为AspDotNet\Lesson3_133.1服务器端控件概述Web窗体是一个窗口类对象，由代码、标记、正文文本和服务器控件组成。在ASP.NET页面元素中，除Html标记外，所有控件实际上是在服务器端运行的。所有服务器控件都必须放在formrunat=“server”与/form标记之间。所有服务器控件都必须使用runat=“server”属性。4什么是控件？不仅仅是页面上的表单元素。ASP.NET是想将页面上所有的内容都用控件表示。5控件的声明声明控件的第1种方法asp:Labelid=messageText=欢迎大家runat=server/asp:Buttonid=enterText=确定onClick=Enter_Clickrunat=server/声明控件的第2种方法asp:Labelid=messagerunat=server欢迎大家/asp:Labelasp:Buttonid=enterText=确定onClick=Enter_Clickrunat=server/asp:Button6控件的分类控件的类型HTML服务器控件Web服务器控件ASP.NET2.0提供了丰富的Web服务器控件：标准控件List控件(列表控件)验证控件Rich控件(高级控件)导航控件登录控件等等73.2HTML服务器端控件这一类控件是主要是为了保留原来的HTML元素标记。一般和原来的HTML标记一一对应，只是增加了runat=“server”。83.3标准控件标准控件几乎是每个ASP.NET应用程序都要用到的。主要包括：显示信息的Label和Literal控件接受用户输入的TextBox、CheckBox、RadioButton控件提交表单数据的Button、LinkButton和ImageButton控件显示图像的Image和ImageMap控件其它控件(Panel控件和HyperLink控件)93.3.1Label控件和Literal控件如果需要动态地修改显示在页面中的文本，可以使用Label控件。Label控件的内容会由服务器端转译成span标签。protectedvoidPage_Load(objectsender,EventArgse){//显示时间lblTime.Text=DateTime.Now.ToString(T);}ShowLabel.aspx10Label控件Label控件的格式化属性BackColor：背景色BorderColor：边框色BorderStyle：边框样式BorderWidth：边框宽度CssClass：关联的CSS类Font：字体ForeColoe：前景色ToolTip：工具提示一般建议：避免使用格式属性，而使用CSS来格式化Label控件的输出内容。ShowLabel.aspxstyletype=text/css.labelstyle{color:red;background-color:yellow;border:Solid2pxRed;}/style11AssociatedControlID属性Label控件的AssociatedControlID属性的作用：一是方便读屏器等程序正确地识别标签和表单，二是当点击标签时，自动把表单焦点设置为相应的表单输入框。12Literal控件Literal控件类似于Label控件，区别在于，Literal控件在转译时不产生span标记，因此，它没有格式化属性。使用Literal控件修改浏览器标题ShowLabel.aspx133.3.2接收用户输入主要使用TextBox、CheckBox、RadioButton等控件来接收用户输入，对应于Html的input标签。TextBox控件TextMode:Single|Multiline|PasswordText:显示的文字MaxLength:整数，表示输入的最大的字符数Rows:整数，当为多行文本时的行数Columns整数，当为多行文本时的列数Wrap:True|False，表示是否允许换行，默认为TrueAutoPostBack:True|FalseOnTextChanged:当文字改变时触发的事件过程14TextBox示例ShowTextBox.aspx15CheckBox控件主要属性：Text:控件上显示的文字TextAlign：对齐方式Checked:是否选中AutoPostBack:是否自动回传主要方法：Focus：设为本控件为输入焦点主要事件：CheckedChanged：选中或取消选中时，在服务器端引发多个CheckBox时，建议使用CheckBoxList控件16RadioButton控件主要属性：Text:控件上显示的文字TextAlign:对齐方式Checked:是否选中GroupName:同一页面的单选钮要分组时，同一组的单选钮要使用同一个组名AutoPostBack:是否回传主要方法：Focus：设为本控件为输入焦点主要事件：CheckedChanged：选中或取消选中时，在服务器端引发多个单选钮时，建议使用RadioButtonList控件17CheckBox与RadioButton示例ShowCheckBox.aspx18CheckBox与RadioButton示例protectedvoidbtnSubmit_Click(objectsender,EventArgse){lblResult.Text=您的选择如下：br;//判断复选框是否选中if(chkNewsletter.Checked)lblResult.Text+=愿意接收邮件列表br;elselblResult.Text+=不愿意接收邮件列表br;//判断单选钮哪个选中strings=null;if(rbMagazine.Checked)s=rbMagazine.Text;if(rbTV.Checked)s=rbTV.Text;if(rbOther.Checked)s=rbOther.Text;lblResult.Text+=您是从+s+获悉我们的网站;}ShowCheckBox.aspx.cs193.3.3提交表单数据Button,LinkButton,ImageButton控件用于向服务器提交表单数据。这3个控件具有相同的功能，却具有不同的外观。Button控件生成普通的按钮，产生的Html输出为inputtype=“submit”/LinkButton控件生成一个链接，使用JavaScript把表单传回服务器：aid=btnSubmit2href=javascript:__doPostBack('btnSubmit2','')提交/aImageButton控件与Button控件类似，只是总是使用图片。ShowButton.aspx20执行跨页面传送设置按钮控件的PostBackUrl属性，可以把表单数据提交到其它页面。ShowButton.aspxButtonSearchResults.aspx21使用PreviousPage属性获取前一网页信息protectedvoidPage_Load(objectsender,EventArgse){if(PreviousPage!=null){TextBoxtbName=(TextBox)PreviousPage.FindControl(tbName);lblSearch.Text=姓名：+tbName.Text;}}22指定默认按钮使用Form控件的DefaultButton属性来指定表单的默认按钮，可以按回车键来调用这个按钮。formid=form1defaultbutton=btnSubmit1runat=server/form233.3.4标准控件综合示例Default.aspx24protectedvoidbtnSubmit_Click(objectsender,EventArgse){lblMessage.Text=H4您输入的个人信息为：/H4;lblMessage.Text+=b姓名/b:+tbName.Text+br;if(rbMale.Checked){lblMessage.Text+=b性别/b:男br;}if(rbFemale.Checked){lblMessage.Text+=b性别/b:女br;}if(cbTour.Checked){lblMessage.Text+=b爱好/b:旅游br;}if(cbNetworking.Checked){lblMessage.Text+=b爱好/b:上网br;}if(cbShopping.Checked){lblMessage.Text+=b爱好/b:购物br;}lblMessage.Text+=b地址/b:+ddlCity.SelectedItem.Text+br;lblMessage.Text+=b简介/b:+tbBrief.Text+br;}253.3.5显示图像Image控件主要属性：•AlternateText:为图像提供替代文本•DescriptionURL：指向详细描述的图像链接•GenerateEmptyAlternateText:为AlternateText设置为空串•ImageAlign:对齐方式•ImageURL:指定图片的URLShowImage.aspx26Image控件protectedvoidPage_Load(objectsender,EventArgse){Randomr=newRandom();switch(r.Next(3)){case0:imgRadom.ImageUrl=Picture1.gif;imgRadom.AlternateText=Picture1;break;case1:imgRadom.ImageUrl=Picture2.gif;imgRadom.AlternateText=Picture2;break;case2:imgRadom.ImageUrl=Picture3.gif;imgRadom.AlternateText=Picture3;break;}}27ImageMap控件ImageMap控件用于在页面上显示图像，并可以划分“热区”。点击图像上不同的区域，可以链接不同的页面。也可以把图像映射当成一个奇特的导航条使用。注意HotSpotMode属性和HotSpot属性的设置。ImageMenu.aspx28protectedvoidmapMenu_Click(objectsender,ImageMapEventArgse){switch(e.PostBackValue){caseToUpper:tbText.Text=tbText.Text.ToUpper();break;caseToLower:tbText.Text=tbText.Text.ToLower();break;caseErase:tbText.Text=String.Empty;break;}}293.3.6Panel控件Panel控件用于处