第六章:常用Web服务器控件
1:如何在Web服务器控件上加入js脚本
2:Label控件
3:TextBox控件
4:Button控件
5:LinkButton控件
6:HyperLink控件
7:ImageButton控件
8:DropDownList控件
9:ListBox控件
10:CheckBox控件
11:RadioButtonList控件
12:BulletedList控件
13:AdRotator控件
14:FileUpload控件
15:文件下载
16:multiview控件
17:Wizard控件
如何在Web服务器控件上加入js脚本
Web服务器是运行在服务器上,然后由服务器转变成Html表单元素。我们可以在
Web控件在服务器运行时,加入js。以后这些js就可以给客户端来使用
1: 格式:控件名.Attributes.Add("事件名","js代码")
2: 加上return false 就可以阻止页面的提交到服务器
举例:
1)做一个登录检验,如果用户不输入用户名或密码。就弹出一个对话框,并且页面
不会提交给服务器。
2)让一个文本框只能够输入数字和退格键
this.TextBox1.Attributes.Add("onkeydown", "if (!(event.keyCode>=48 && event.keyCode<=57 || event.keyCode==8)) return false;");
Label控件
1)用来对功能进行一个说明
2)动态显示运行的结果。
举例:
1)从数据库中取出一个学生信息,判断是否欠费,用Label显示结果
2)从数据库中查询出信息,如果有则显示信息,如果没有则提示查询 不到信息
TextBox控件
属性:
A)ToolTip:让当鼠标指向文本框提示信息
B)Text:得到用户输入的文本
C)TextMode:设置文本的文本模式
举例:
1)让用户输入一个用户名和密码从数据库中查询,如果
正确则进入首页,如果不正确则进入错误提示页面
2)输入一个商品编号,输入购买数量,输入款,点击按钮
求出商品名称,实款,找零
Button按钮:
button按钮有个特性,就是单击按钮时,页面会自动提交
属性:
A)BorderStyle:边框样式
B)PostBackUrl:用于指定当单击按钮时,所转到的新的页面,与直接在按钮的单 击事件里面写上Response.Redirect功能类似
C)OnclientClick:给按钮在客户端添加js。这样当按钮被单击时,首先触发
客户端的单击事件,执行js。之后才会视情况要不要PostBack回服务器引发
服务器的Click事件。通过在客户端 "return false"可以阻止页面PostBack 回服务器端
举例:
1):让用户在文本框中输入一个职工编号,单击按钮时,提示要不要删除,
如果是则删除
注意this.Button1.Attributes.Add或this.Button1.OnClientClick
2):让用户输入一些注册信息,并准备把这些注册信息添加到数据库中,
如果这些输入信息没有通过表单验证,则显示错误提示,并不能
回传给服务器。
3):如何实现用按钮在打开另外一个页面时,不刷新本页面。
在OnclientClick后面加上return false
LinkButton按钮
与button一样,只不过一个是以超链接形式来显示的
HyperLink控件
属性:
Text:设置链接字段所显示的文本
Navigateurl:设置链接的目标页面
Target:设置目标页面的框架
HyperLink与LinkButton的最大区别在于,HyperLink单击之后页面不会回 传给服务器,而LinkButton按钮会首先把页面回传给服务器
可以在Page_Load事件里面动态设置Navigateurl。
ImageButton控件
与Button控件完全一样,只不过是以图片的形式来实现的
DropDownList控件
属性:
Item:用来决定里面的项。每一项有标签与值来组成
AutoPostBack:用来设置当选中内容发生改变之后,是否回传给服务器
SelectedValue:得到用户所选择项的值
SelectedItem.Text:得到用户所选择项的文本
Items.Add(new ListItem("文本", "值")):添加一项
Items.RemoveAt(下标):删除一项
Items.Insert:插入一项
DataSource:设置数据源,与数据库进行绑定
DataTextField:显示文本的字段
DataValueField:显示值的字段
举例:
1)利用AutoPostBack让用户在源页面里选择城市,
在目的页面里面显示所有这个城市的工作
2)作一个登录页面。启动时从数据库里面读出对应的用户名密码。
3)让用户输入一个员工的基本信息(包含下拉框),然后添加数据库
ListBox控件
属性:
1:SelectionMode:是单选还是多选
举例:
1)利用AutoPostBack让用户在源页面里选择城市,
在ListBox里面显示所有这个城市的工作
2)让用户选择购买的商品,然后从数据库中计算出应付款
CheckBox,控件
属性:
1:Item:列表项,每一个列表项都由一个文本与一个值所构成,
当文本是html标记时,会显示html标记
2:Checked:用来决定CheckBox控件是否被选中了
3:DataSource:设置数据源,与数据库进行绑定
4:DataTextField:显示文本的字段
5:DataValueField:显示值的字段
举例:
1:让用户选择购买的商品,然后从数据库中计算出应付款,根据是否
打折来决定最终应付款
2:从数据库里面读出商品资料,读出图片,让用户打勾来决定购买的商品,
算出最终的应付款
RadioButtonList控件
属性:
SelectedValue:得到用户所选择的值
举例:
1)在线投票。源页面显示RadioButtonList显示投票项目,目的页面
显示投票项,进行投票。
比如:投什么票,有那些选择。等
BulletedList
动态产生列表项
属性:
1)DataSource:设置数据源,与数据库进行绑定
2)DataTextField:显示文本的字段
3)DataValueField:显示值的字段
4)DisPlayStyle:显示的状态,是否是超链接
5)BulletStyle:项目列表样式
6)BulletImageUrl:选择用户自定义的项目图标
7)Click事件:
this.BulletedList1.Items[e.Index].Value得到
单击那一项的值
说明:
1:该控件不支持通过Server.Transfer来传递Web控件的值,
2:通过下列的语句,可以传递用户单击的value
Response.Redirect("Default2.aspx? id="+this.BulletedList1.Items[e.Index].Value.ToString());
举例:
源页面:显示用列表项显示很多公司,目的页面得到公司的信息
AdRotator控件
功能:随机显示广告
步骤:
1:创建一个包含着广告细节的XML文件.元素:
A)ImageUrl 图片地址
B)NavigateUrl 连接地址,广告导航去的地方
C)AlternateText 当鼠标放图片上显示的提示文字
D)Keyword 该条广告的关键词,通过Keywordfilter属性进行过滤
E)Impressions 权重,就是说显示的频率权重
创建广告文件时有一点值得特别注意的是,它是区分大小写的。
因此其中所包含元素的大小写应该拼写正确,
<?xml version="1.0" encoding="gb2312"?>
<Advertisements>
<Ad>
<ImageUrl>aspcn_bbs.gif</ImageUrl>
<NavigateUrl>http://www.aspcn.com/bbs</NavigateUrl>
<AlternateText>ASPCN技术论坛</AlternateText>
<Keyword>bbs</Keyword>
<Impressions>50</Impressions>
</Ad>
</Advertisements>
一定要区分大小写
2:将广告XML文件连接到这个控件。
AdvertisementFile
3:设置KeywordFilter进行只显示那种类型的广告
FileUpload(文件上传控件)
1)把表单的<form id="form1" runat="server" enctype="multipart/form-data">
2)添一个FileUpLoad控件
3)添加一个按钮,在按钮里面写上代码
if (this.FileUpload1.HasFile)
{
this.FileUpload1.SaveAs(Server.MapPath("pic") + "\\" + this.FileUpload1.FileName);
}
4)可以在FileUpLoad边放置一个html图片控件,然后在服务器动态向FileUpLoad加上事件
this.FileUpload1.Attributes.Add ("onchange","form1.pp.src=form1.FileUpload1.value");
举例:
让用户输入职工的工号,姓名,图片。把图片上传到服务器端,同时更新数据库
文件下载
private void FileDown(string filePath)
{
FileInfo saveFile = new FileInfo(filePath);
Response.Clear();
Response.ClearHeaders();
Response.Buffer=false;
Response.ContentType="application/octet-stream";
Response.AppendHeader("Content-Disposition","attachment;filename="+saveFile.Name );
Response.WriteFile(saveFile.FullName);
Response.Flush();
Response.End();
}
multiview向导控件
1:一个MultView可以包含很多向导,每一个向导就是一个View。
2:MultView的每个按钮都要自己来加入
3:通过MultiView1.ActiveViewIndex来决定目前显示那个View
举例:
1:在线调查
第一个View: 用户名,真实姓名,邮箱
第二个View: 喜欢的编程语言
第三个View: 身份(学生,社会人士,其它)
第四个View: 显示前三个填写的内容。并把用户填写的数据写入到数据库
Wizard控件
1:每一个Wizard控件,由以下几个部分构成
A)SliderBar:侧栏
B)Head:头部
C)WizardStep:步骤
D)Navigate:导航部分
1:每一个Wizard控件,包含多个WizardStep
2:选中Wizard控件,单右-->添加WizardStep。可以添加一个步骤
3:选中Wizard控件,单右-->编辑模板-->HeadTemplte-->可以添加头部
属性:
1)ActiveStepIndex:活动步骤的索引
2)DisPlayCancelButton:是否显示取消按钮,可以取消按钮中
编写关闭窗体的代码
3)DisPlaySliderBar:是否显示则栏
4)CancelButtonStyle:取消按钮样式,还有其它的按钮样式
5)SliderBarStyle:侧栏样式
6)StepStyle:步骤样式
7)WizardSteps.Count:得到所有步骤的个数
事件:
1)CancelButtonClick:取消按钮单击事件
2)FinshButtonClick:完成按钮单击事件
3)NextButtonClick:下一步按钮单击事件
e.CurrentStepIndex:得到当前的步骤
e.Cancel = true;决定页面是否导航
举例;
1)生成一个关于系统配置的向导.输入服务器名,用户名,密码。最后生成一个xml文件
评论