网页标准控件的使用.ppt

1、从标准控件开始,Web服务器端控件、HTML控件和用户自定义控件是ASP.NET支持的三种控件。Web服务器端控件是ASP.NET首选控件，包括标准控件和验证控件，我们重点的关注是常用Web服务器端标准控件。,服务器端控件概述,Web服务器端控件是ASP.NET重要的组成部分。服务器端控件包含方法以及与之关联的事件处理程序，并且这些代码都在服务器端执行。 Web服务器端控件先在服务器执行，执行的结果以HTML的形式发送给客户端浏览器进行解析，这样在使用ASP.NET编写服务器端程序时，不必考虑客户浏览器的兼容性问题。,Web服务器端标准控件类型,Web服务器端标准控件结构,格式如下： 或者写成

2、 代码需要写在一对尖括号内，前缀asp为必加项，Control表示控件的类型；ID为该控件的属性，是控件的唯一标识，即编程时使用的名字；runat是固有属性，其值为固定值“server”，表示这是一个服务器端控件。根据实际情况，里面还可以有更多的属性，可以在属性窗口设置或在源代码中直接添加。 实例演示,“学生基本信息登记表”案例,“学生基本信息登记表”案例步骤,1. 创建一Web窗体文件 2. 页面的界面设计 1)使用HTML中的表格控件搭建页面框架 2)界面设计，在表格中添加各种控件 3. 为控件添加脚本 4. 测试页面,给RadioButtonList控件添加脚本,protected vo

3、id radlistLanguage_SelectedIndexChanged1(object sender, EventArgs e) if (radlistLanguage.SelectedItem.Text = 其他) lblLanguage.Text = 您的外语种类是：; Panel1.Visible = true; else Panel1.Visible = false; ,本节知识点,1. 文本框控件（TextBox） 2. 三种按钮控件(Button、ImageButton和LinkButton控件) 3. 显示控件(Label控件、Image控件) 4. 选择与列表控件(Ra

4、dioButton控件和 RadioButtonList控件、CheckBox控件和CheckBoxList控件、ListBox控件和DropDownList控件) 5. 文件上传控件(FileUpload控件) 6. Table控件 7. Panel控件和PlaceHolder控件,1. 文本框控件（TextBox）,实例演示,2. 按钮控件Button,Button控件，源视图中对应的标签为： 按钮控件均可以把页面上的输入信息提交给服务器，对其发生Click（单击）事件能激活服务器脚本中对应的事件过程代码。 实例演示,代码部分,protected void btnButton_Click(

5、object sender, EventArgs e) txtInfo.Text = 您单击了提交按钮！; 源代码视图模式，Button控件的标签为： OnClick为Button控件的一个属性，属性值为btnButton_Click，表明当Button控件发生Click事件时，激活了btnButton_Click事件过程脚本， 该过程通过“txtInfo.Text = 您单击了提交按钮！”语句，向TextBox控件中写入“您单击了提交按钮！”。,3. 显示控件(Label控件、Image控件),Label控件用于在页面上显示文本，Image控件用于在页面上显示图像，使用Image控件的Ima

6、geUrl属性设置图形文件的URL地址，设置完成后对应的图标才会显示相应的图形。 实例演示,4. 选择与列表控件,1）RadioButton控件和RadioButtonList控件 2）CheckBox控件和CheckBoxList控件 3）ListBox控件和DropDownList控件,RadioButton控件和 RadioButtonList控件,使用RadioButton控件可以生成一组单选按钮。 实例演示 RadioButtonList控件具有和RadioButton控件同样的功能，并且可以方便管理各个数据项。 实例演示,RadioButton控件实例脚本,protected vo

7、id btnSubmit_Click(object sender, EventArgs e) string sex=; if (radMan.Checked=true) sex = 男生; if (radWoman.Checked = true) sex = 女生; lblResult.Text = 您是一名 + sex; ,RadioButtonList控件完成数据项的添加后源代码部分, 英语 俄语 法语 ,RadioButtonList控件脚本部分,protected void btnSubmit_Click(object sender, EventArgs e) lblResult.Te

8、xt = 您选择了 + radlistLanguage.SelectedItem.Text; ,2）CheckBox控件和CheckBoxList控件,CheckBox控件可以生成一组复选框 实例演示 CheckBoxList控件 用于生成数量较多的复选框 实例演示,CheckBox控件实例脚本,protected void btnSubmit_Click(object sender, EventArgs e) string msg = ; if (chkFavorite1.Checked = true) msg = msg + chkFavorite1.Text+ ; if (chkFavo

9、rite2.Checked = true) msg = msg + chkFavorite2.Text + ; if (chkFavorite3.Checked = true) msg = msg + chkFavorite3.Text + ; if (chkFavorite4.Checked = true) msg = msg + chkFavorite4.Text + ; lblResult.Text = 您喜欢 + msg + 。; ,CheckBoxList控件实例脚本,protected void btnSubmit_Click(object sender, EventArgs e)

10、 string msg=; for (int i = 0; i chklistFavorite.Items.Count-1; i+) if (chklistFavorite.Itemsi.Selected) msg = msg + chklistFavorite.Itemsi.Text + ,3）ListBox控件和DropDownList控件,ListBox控件用于创建允许单选或多选的列表框 实例演示 DropDownList控件用创建下拉列表框，只能选择列表框中的某一项 实例演示,ListBox控件实例脚本,protected void btnSubmit_Click(object sen

11、der, EventArgs e) string msg = ; for (int i = 0; i lstCourse.Items.Count - 1; i+) if (lstCourse.Itemsi.Selected) msg = msg + lstCourse.Itemsi.Text + ,DropDownList控件实例脚本,protected void btnSubmit_Click(object sender, EventArgs e) lblResult.Text = 您所在的班级是 + dlistClass.SelectedItem.Text; ,5. 文件上传控件(File

12、Upload控件),FileUpload控件可以将用户提供文件从客户端传送到服务器。通过设置控件的相关属性，可以控制文件的传送方式并自动完成文件的上传过程。,FileUpload控件案例脚本,protected void btnSubmit_click(object sender, EventArgs e) if (FileUpload1.HasFile = true) string strErr = ; /获得上传文件的大小 int filesize = FileUpload1.PostedFile.ContentLength; if (filesize 1024 * 1024) strEr

13、r += 文件大小不能大于1Mn; if (strErr = ) string path = Server.MapPath();/获得服务器文件当前路径 /把上传文件保存在当前路径的upload文件夹中 FileUpload1.PostedFile.SaveAs(path + upload + FileUpload1.FileName); lblInfo.Text = 文件保存成功; else lblInfo.Text = 请指定上传的文件; ,6. Table控件,HTML提供了Table控件，但是这种Table控件生成的表格多用于显示静态数据，表格在使用之前就已经定义好了行数和列数，不能根

14、据所要显示的数据动态的调整表格的行数和列数。 服务器端Table控件也可以创建表格，它可以通过编程的方式根据数据内容动态生成表格或动态调整表格的行数和列数。 动态表格的生成除了需要使用Table控件外，还需要使用TableRow控件和TableCell控件。Table控件代表整个表格，TableRow控件代表表格中的行，TableCell控件代表每一行中的单元格。,Table控件案例脚本,protected void btnSubmit_Click(object sender, EventArgs e) /获得表格的行数赋给变量rows int rows = int.Parse(txtRow.

15、Text); /获得表格的列数赋给变量cells int cells = int.Parse(txtCell.Text); int count = 0; for (int i = 0; i rows; i+) /创建表格的一行 TableRow r = new TableRow(); for (int j = 0; j cells; j+) /创建一个单元格 TableCell c = new TableCell(); count+; /将count的值转换为字符串在单元格中显示出来 c.Controls.Add(new LiteralControl(count.ToString(); /将单

16、元格插入对应的行中 r.Cells.Add(c); /将行插入表格中 tableInfo.Rows.Add(r); ,7. Panel控件和PlaceHolder控件,ASP.NET提供两种容器控件Panel控件和PlaceHolder控件。 Panel控件可以将放入其中的一组控件作为一个整体来操作。 案例演示 PlaceHolder控件用于在页面上保留一个位置，以便运行时在该位置动态放置其他的控件。 实例演示,Panel控件案例脚本,protected void radlistLanguage_SelectedIndexChanged(object sender, EventArgs e) if (radlistLanguage.SelectedItem.Text = 其他语种) Panel1.Visible = true; else Panel1.Visible = false; ,PlaceHolder控件案例脚本,protected void Page_Load(object sender, EventArgs e) Label lblTitle = new Label(); lblT