《P.NET(C#)网站开发-电子教案-源代码-张志明 第2章 常用标准控件》由会员分享，可在线阅读，更多相关《P.NET(C#)网站开发-电子教案-源代码-张志明 第2章 常用标准控件（52页珍藏版）》请在金锄头文库上搜索。
1、第2章 常用标准控件,学习目标,通过本章知识的学习，读者首先对服务器控件有些初步了解；掌握TextBox、Label、Button、DropDownList等常用控件的使用方法，以及利用表格进行网页页面布局的方法技巧。并利用本章知识设计和实现用户注册页面。通过本章内容的学习，读者可以达到以下学习目的： 了解服务器控件基础知识。 掌握文本控件（Label控件、TextBox控件）的使用方法。 掌握选择控件（RadioButtonList控件、CheckBoxList控件、DropDownList控件等）的使用方法。 掌握按钮控件（Button控件、LinksButton控件、ImageButto
2、n控件等）的使用方法。 掌握利用表格进行页面布局的方法。 掌握网页设计中容器控件的使用方法。,2.1 情景分析,本章的会员注册仅完成会员注册信息填写（如图2-1所示）和信息显示功能（如图2-2所示）。,2.2 服务器控件概述,ASP.NET服务器控件是运行在服务器端并且封装了用户界面和其它功能的组件。控件的含义表明它不仅是具有呈现外观作用的元素，而且是一种对象，一种定义Web应用程序用户界面的组件。 1.服务器控件的属性和事件 服务器控件的属性是指控件中具有的与用户界面特征相关的字段或与运行状态有关的字段。大部分服务器控件的属性可分为五类：布局、数据、外观、行为和杂项。 事件是指程序得以运行的
3、触发器（如Button控件的Click事件等），当用户与Web页面进行交互时被触发，并通过执行事件程序做出相应的响应。,2.服务器控件的特点 公共对象模型。服务器控件是基于公共对象模型的，因此它们可以相互共享大量属性，这是软件复用思想的体现。 保存视图状态。传统的HTML元素是无视图状态的。而当页面在服务器端和客户端之间来回传送时，服务器控件会自动保存视图状态。 数据绑定模型。ASP.NET服务器控件为使用多种数据源提供了方便，可以快速实现数据绑定和访问，大大简化了动态网页的创建过程。 用户定制。服务器控件为网页开发者提供了多种机制来定制自己的页面。 配置文件。服务器控件在Web应用程序级别上
4、可通过web.config文件对程序进行配置。 创建浏览器特定的HTML。当浏览器申请某个页面时，服务器控件会确定浏览器的类型，然后生成适合该浏览器显示的HTML代码。,2.3 常用服务器控件,1. Label控件 Label控件用于在页面上显示文本信息，它不但支持静态文本显示，而且还支持用户以编程方式动态显示文本。Label控件常用的属性有ID、Text和Font属性等。其中，ID表示控件标识，Text表示控件显示的文本内容，Font属性表示字体格式设置，如大小、颜色等。,【例2-1】利用Label控件动态显示改变文本内容与显示格式（Ex2-1.aspx）。 protected void B
5、utton1_Click(object sender, EventArgs e) lblmes.Text = DateTime.Now.ToString(); lblmes.ForeColor = System.Drawing.Color.Red; lblmes.Font.Bold = true; ,2.TextBox控件,TextBox控件又称文本框控件，是用于输入任何类型的文本、数字或其它字符的文本区域。同时，TextBox控件也可以设置为只读控件，用于文本显示。,【例2-2】利用TextBox控件制作用户登录页面，如图2-7所示。用户名最大支持3个字符，光标移出姓名文本框时屏幕上出现动态
6、提示文字；密码输入时以黑点显示（Ex2-2.aspx）。 protected void txtname_TextChanged(object sender, EventArgs e) Response.Write(“你的姓名是：“ + txtname.Text); ,2 选择控件,RadioButton控件 RadioButton控件是单选按钮控件，当用户选择某个单选按钮时，同组中的其它选项不能被同时选中。,【例2-3】利用RadioButton控件实现考试系统中单选题的操作，如图2-8所示。用户不选择答案单击“提交”按钮时，页面弹出“请选择答案！”提示；当用户选择正确答案B时，页面提示“恭喜
7、你，回答正确！”；否则提示“对不起，正确答案是B！”（Ex2-3.aspx）。 protected void Button1_Click(object sender, EventArgs e) /如果没有选择答案 if (R1.Checked = false ,else /判断所选答案是否正确 if (R2.Checked = true) Response.Write(“alert(恭喜你，回答正确！)“); else Response.Write(“alert(对不起，正确答案是B！)“); ,2. RadioButtonList控件,RadioButtonList控件有效地解决了每个Rad
8、ioButton控件在RadioButton组中是相互独立的问题，为读者提供了一组RadioButton，大大方便了用户操作。,【例2-4】利用RadioButtonList控件AutoPostBack属性和OnSelectedIndex Changed事件实现性别单选和提示文字即时更新，如图2-9所示。如用户选择“男”，页面下面的文字立即改变为“你选择的是：男；对应的值为：1”（Ex2-4.aspx）。 protected void rblsex_SelectedIndexChanged(object sender, EventArgs e) lbl1.Text = rblsex.Selec
9、tedItem.Text; lbl2.Text = rblsex.SelectedItem.Value; ,3.CheckBox控件,CheckBox控件用来表示是否选取了某个选项，常用于具有是/否、真/假选项的选取。CheckBox控件和RadioButton控件的区别在于前者允许多选。由于CheckBox控件和RadioButton控件的常用属性大体相同。 【例2-5】利用CheckBox控件实现考试系统中不定项选择题的操作，如图2-10所示。当用户选择ABC三个答案时，提示“回答正确”；否则提示“错误，正确答案为ABC”（Ex2-5.aspx）。,protected void Butto
10、n1_Click(object sender, EventArgs e) if (!ckb1.Checked ,CheckBoxList控件 用CheckBox控件可以实现多选功能，但在判断被选中的选项时需要对每一个对象都进行判断。CheckBoxList控件和RadioButtonList控件类似，可以方便地判断用户选中的选项。 【例2-6】利用CheckBoxList控件实现用户个人爱好选择功能页面，如图2-11所示。根据用户所选择的爱好不同，页面下方出现的选择结果动态变化（Ex2-6.aspx）。,protected void Button1_Click(object sender, E
11、ventArgs e) string result = “你选择的是：“; for (int i = 0; i ckl1.Items.Count; i+) if (ckl1.Itemsi.Selected) result += ckl1.Itemsi.Text + “ ,DropDownList控件 DropDownList控件是一个下拉式列表控件，功能和RadioButtonList控件类似，用户可 【例2-7】利用DropDownList控件实现用户出生地选择功能，如图2-12所示。根据用户所选择的出生地不同，点击“提交”按钮后提示不同的信息（Ex2-7.aspx）。 以从下拉列表中选择单
12、一选项。,protected void Button1_Click(object sender, EventArgs e) lblmes.Text += ddlbir.SelectedItem.Text; ,Calendar控件 Calendar控件是日历控件，用于选择日期。可以结合TextBox控件一起使用，实现日期输入，从而规范并简化的日期格式输入。 【例2-8】利用Calendar控件实现用户入团日期输入功能，如图2-13所示。用户通过选择Calendar控件的日期，使其自动出现TextBox控件文本框中（Ex2-8.aspx）。 protected void Calendar1_Sel
13、ectionChanged(object sender, EventArgs e) txtdate.Text = Calendar1.SelectedDate.ToShortDateString(); ,3 按钮控件,Button控件 Button控件是读者使用频率最高的控件之一，用户通过单击Button来执行该控件的Click事件。Button控件的常用属性有Id、Text、PostBackUrl，以及onclick事件。其中，PostBackUrl属性用于设置单击控件所发送的URL地址。 【例2-9】利用Button控件控制Calendar控件的显示，效果如图2-14所示。单击“显示日历”
14、按钮，出现日历；用户选择日期后，日期出现在文本框中，日历窗口关闭（Ex2-9.aspx）。,protected void Calendar1_SelectionChanged(object sender, EventArgs e) txtdate.Text = Calendar1.SelectedDate.ToShortDateString(); Calendar1.Visible = false ; protected void Button1_Click(object sender, EventArgs e) Calendar1.Visible = true; ,LinkButton控件
15、LinkButton控件又称超链接按钮控件，该控件在功能上与Button控件相同，但样式以超链接形式显示。LinkButton控件有一个PostBackUrl属性，该属性用于设置单击控件时链接到的网址。 【例2-10】利用LinkButton控件PostBackUrl属性实现超链接功能，如图2-15所示。用户单击“打开Ex2-9”文本，页面将转向Ex2-9.aspx页面（Ex2-10.aspx）。, 超链接页面打开Ex2-9 ,ImageButton控件 ImageButton控件是图片按钮控件，用户单击控件上的图片引发控件的Click事件。ImageButton控件有一个ImageUrl属性
16、，该属性用于设置按钮上显示的图片位置。 【例2-11】利用ImageButton控件达到美化按钮的效果，如图2-16所示（Ex2-11.aspx）。, 你的入团时间是： ,protected void ImageButton1_Click(object sender, ImageClickEventArgs e) Calendar1.Visible = true; ,FileUpload控件 FileUpload控件是用于客户端文件上传到服务器的控件。该控件显示1个文本框和1个浏览按钮，用户可以通过“浏览”按钮选择文件。FileUpload控件有一个Save As方法，用于将上传的文件保存到服务器。,【例2-12】利用FileUpload控件实现文件上传操作，如图2-17所示。用户单击页面“浏览”按钮，选择要上传的文件，单击“上传”按钮，文件将上传到服务器网站的根目录下（Ex2-12.aspx）。 请选择上传的文件： ,
