第5章 其它服务器控件修改.docx

第5章 其它服务器控件修改.docx

《第5章 其它服务器控件修改.docx》由会员分享，可在线阅读，更多相关《第5章 其它服务器控件修改.docx（31页珍藏版）》请在冰豆网上搜索。

第5章其它服务器控件修改

第5章其它服务器控件

除了构架上的变化外，ASP.NET2.0还增加和改进了不少ASP.NET服务器控件，本章主要讲解在ASP.NET2.0中新增和得到加强的一些服务器控件。

5.1　BulletedList控件

5.1.1　BulletedList控件简介

BulletedList控件的主要功能是在页面上显示项目符号和编号格式。

BulletedList控件的主要属性有BulletStyle、DisplayMode、Items和主要事件Click。

BulletedList控件常用属性的功能如表5.1所示。

表5.1　BulletedList控件常用属性

属性

描述

BulletImageUrl

规定定制的列表项目图形符号的URL。

BulletStyle

规定项目符号列表的样式。

NotSet：

未设置；Numbered：

数字；LowerAlpha：

小写字母；UpperAlpha：

大写字母；LowerRoman：

小写罗马数字；UpperRoman：

大写罗马数字；Disc：

实心圆；Circle：

圆圈；Square：

实心正方形。

CustomImage：

自定义图像

Items

项目集合编辑器，进行列表项目的编辑。

该属性对应着System.Web.UI.WebControls.ListItem对象集合。

项目符号编号列表中的每一个项均对应一个ListItem对象。

ListItem对象有四个主要属性：

Enabled：

该项是否处于激活状态。

默认为True；

Selected：

该项是否处于选定状态。

默认为True；

Text：

该项的显示文本；

Value：

该项的值。

DisplayMode

规定被显示的列表的类型。

DisplayMode设置为Text时，显示为普通文字（默认）；设置为HyperLink时，显示为超链接；设置为LinkButton时，显示LinkButton。

FirstBulletNumber

规定在有序列表中列表项目的起始数字。

Target

规定在何处打开目标URL。

BulletedList控件主要事件是Click事件，该事件在BulletedList控件的DisplayMode处于LinkButton模式下，并BulletedList控件中的某项被点击时触发。

触发时将被点击项在所有项目列表中的索引号（从0开始）作为传回参数传回服务器端。

5.1.2　应用案例

使用BulletedList控件创建项目列表，可以创建静态列表，也可以以编程的方式动态加载列表项。

还可以将DisplayMode属性设置为LinkButton时，使表项可响应用户的选择事件，程序Default.aspx中所使用的BulletedList控件实现了上面所说的功能，Default.aspx文件设计界面如图5.1所示。

图5.1　Default.aspx文件设计界面图

具体操作步骤如下：

（1）新建一个网站http:

//localhost/Website/。

（2）在“解决方案管理器窗口”中该网站名上单击右键，在出现的快捷菜单中选择“添加新项”子菜单，在出现的“添加新项”对话框中的“模板”中选“样式表”，用默认的“StyleSheet.css”名称，如图5.2所示，单击“添加”。

图5.2　添加样式表文件

　　（3）StyleSheet.css样式表的内容如下：

body

{

font-size:

small;

}

.mainTitle

{

font-size:

12pt;

font-weight:

bold;

font-family:

宋体;

}

.commonText

{

font-size:

11pt;

font-family:

宋体;

}

.littleMainTitle

{

font-size:

10pt;

font-weight:

bold;

font-family:

宋体;

}

（4）打开Default.aspx文件源代码，使用fieldset与legend标签对表单内容分组。

内容如下：

设计界面如图5.3所示。

图5.3　Default.aspx文件设计界面图

　　（5）在Default.aspx文件的设计视图，从工具箱中拖拽一个标签控件、BulletedList控件、文本框控件、Button控件和一条直线，如图5.4所示。

图5.4　Default.aspx文件设计界面图

（6）设置控件的属性，如表5-2所示。

表5.2Default.aspx文件包含的控件及属性

控件类别

控件名

控件标识

属性

属性值

备注

Web控件

Label

Label1

Visible

False

Web控件

BulletedList

BulletedList1

BulletStyle

Numbered

DisplayMode

LinkButton

ListItem

列表1/列表2

Web控件

TextBox

TextBox1

—

—

用于输入列表项

Web控件

Button

Button1

Text

增加

DOCUMENT

Title

示例5-1

用于窗口的标题

StyleSheet

StyleSheet.css

链接的样式表

（7）编写有关控件的事件代码。

Default.aspx事件代码如下：

protectedvoidPage_Load（objectsender,EventArgse）

{

if（!

IsPostBack）

{

this.BulletedList1.Items.Add（"列表3"）;

}

}

protectedvoidButton1_Click（objectsender,EventArgse）

{

stringstrItem=this.TextBox1.Text.ToString（）;

this.BulletedList1.Items.Add（strItem）;

Response.Write（"添加成功！

"）;

}

protectedvoidBulletedList1_Click（objectsender,BulletedListEventArgse）

{

ListItemlst=BulletedList1.Items[e.Index];

this.Label1.Text="你选择的项的索引为：

"+e.Index.ToString（）;

this.Label1.Text+="
"+"它的值为：

"+lst.Value;

this.Label1.Visible=true;

}

}

该程序能够把用户输入的项加载到项目列表中，浏览该程序，当用户单击各项目名称时，系统就会作出响应，效果如图5.5所示。

当用户在文本框中输入项目名称后，单击“增加”按钮，就会在项目列表中添加一项，效果如图5.6所示。

图5.5　单击列表项2

图5.6　添加列表项

5.2　FileUpload控件

5.2.1　FileUpload控件简介

FileUpload控件是ASP.NET新添加的控件，为实现文件上传提供了一个非常方便的途径，访控件允许用户上载图片、文本等其它文件到服务器的指定目录。

它由一个文本框和一个“浏览”按钮组成。

用户可以在文本框中输入完整的文件路径，或通过“浏览”按钮选择需要上传的文件。

该控件的声明方式很简单，不需要进行任何属性设置。

如果想完成上传文件的功能，还需要添加相关的事件处理程序并实现。

这一过程需要使用控件的属性和方法等，FileUpload控件常用属性如表5-3所示。

表5.3FileUpload控件常用属性

属性

数据类型

说明

FileBytes

Byte[]

获取上传文件的字节数组

FileContent

Stream

获取上传文件的Stream对象

FileName

String

获到上传文件载客户端的文件名称（完全路径）

HasFile

Bool

获取布尔值，用以表示控件是否包含有文件

PostedFile

HttpPostedFile

获取对客户端已上传文件的相关属性

ContentType

String

获取上传文件的MIME内容类型

ContentLength

Int

获取上传文件的大小（以字节为单位）

用户选择要上传的文件并提交请求后，该文件将作为请求的一部分上传。

文件将被完整地缓存在服务器内存中。

文件完成上传后，代码开始运行。

在代码运行时，可以检查文件的特征，例如文件的名称、大小和MIME类型，然后保存该文件，也可以将文件当做字节数组或流来使用。

另外，FileUpLoad控件调用SaveAs方法，将文件保存在服务器中，方法SaveAs（Stringfilename）中的参数filename是指被保存在服务器端的上传文件的绝对路径。

5.2.2　应用案例

程序FileUpload.aspx中，使用FileUpload控件，完成文件的上传，设计界面如图5.7所示。

图5.7　设计界面图

具体操作步骤如下：

（1）以5.1.2节中新建一个网站http:

//localhost/Website/为例。

（2）在“解决方案管理器窗口”中该网站名上单击右键，在出现的快捷菜单中选择“添加新项”子菜单，在出现的“添加新项”对话框中的“模板”中选“Web窗体”，在下边“名称”后输入FileUpload.aspx文件名，单击“添加”按钮。

（3）在FileUpload.aspx文件中，使用fieldset与legend标签对表单内容分组，页面中的样式表也使用StyleSheet.css样式表。

（4）在FileUpload.aspx文件的设计视图，从工具箱中拖拽一个FileUpload控件、一个Button控件和两个标签控件，如图5.8所示。

图5.8　FileUpload.aspx文件设计界面图

（5）设置控件的属性，如表5-4所示。

表5.4FileUpload.aspx文件包含的控件及属性

控件类别

控件名

控件标识

属性

属性值

备注

Web控件

FileUpload

FileUpload1

—

—

Web控件

Button

BtnUpload

Text

上传

Web控件

Label

LabMessage1

ForeColor

red

Web控件

Label

LabMessage2

—

—

DOCUMENT

Title

示例5-2

用于窗口的标题

StyleSheet

StyleSheet.css

链接的样式表

（6）在FileUpload.aspx文件设计视图中，双击Button按钮，单击事件的代码如下：

protectedvoidBtnUpload_Click（objectsender,EventArgse）

{

boolfileOK=false;

stringpath=Server.MapPath（"~/Up/"）;

if（FileUpload1.HasFile）　//如果存在文件

{StringfileExtension=System.IO.Path.GetExtension（FileUpload1.FileName）.ToLower（）;//获取文件扩展名

String[]allowedExtensions={".gif",".png",".bmp",".jpg"};

for（inti=0;i

{

if（fileExtension==allowedExtensions[i]）

{fileOK=true;

}

}

}

if（fileOK）

{

try

{

FileUpload1.SaveAs（path+FileUpload1.FileName）;　//文件保存

LabMessage1.Text="文件上传成功.";

LabMessage2.Text="原文件路径：

"+FileUpload1.PostedFile.FileName+"
"+"文件大小：

"+FileUpload1.PostedFile.ContentLength+"字节
"+"文件类型：

"+FileUpload1.PostedFile.ContentType+"
";

}

catch（Exceptionex）

{

LabMessage1.Text="文件上传不成功.";

}

}

else

{

LabMessage1.Text="只能够上传图片文件.";

}

}

运行FileUpload.aspx文件，单击“浏览”按钮，选择一个图片文件，如图5.9所示，单击“上传”按钮，执行的结果如图5.10所示。

图5.9　单击“浏览”按钮效果图

图5.10　单击“上传”按钮效果图

5.3　HiddenField控件

5.3.1　HiddenField控件简介

HiddenField控件（习惯上称为隐藏域）与HtmlInputHiddenHTML服务器控件功能一样，HiddenField控件可以用来建立一个隐含的Input隐藏域（即它在页面上呈现为元素），ASP.NET允许你将信息存储在Input隐藏域中。

隐藏域在浏览器中不以可见的形式呈现，但可以像对待其他标准服务器控件一样设置其属性。

当向服务器提交页面时，隐藏域的内容将在HTTP窗体集合中随同其他控件的值一起发送。

因此，可以将隐藏域作为一个信息储存库，将希望直接存储在页面中的任何特定于页面的信息放置到其中，它提供了一种在页面中存储信息但不显示信息的方法。

例如，可以在隐藏域中存储用户首选项设置，以便可以在客户端脚本中读取此设置。

若要将信息放入隐藏域中，请在两次回发之间将其Value属性设置为要存储的值。

如下面的代码所示，可以在隐藏域中存储一些数据信息。

HiddenFieldID="HiddenField1"runat="server"Value="隐藏域的初始值"/>

上面的代码虽然不会在页面运行的时候显示文本“隐藏域的初始值”，但查看页面代码的时候会发现页面中会生成如下HTML代码：

同样，也可以通过它的Value属性来通过代码为它赋值。

如：

HiddenField1.Value="ASP.NET";

由于隐藏域在服务器代码和客户端脚本之间共享信息，因此在将页面回发到服务器之前，客户端脚本可以更改隐藏域的值。

与任何其他Web服务器控件一样，HiddenField控件中的信息在回发期间可用，这些信息在该页之外无法保留。

5.3.2　应用案例

程序HiddenField.aspx中，隐藏控件HiddenField的初始值为“ASP.NET程序设计”，当在文本框中输入值后，单击“更改隐藏控件的值”，HiddenField控件保存页面文本框控件TextBox_value中输入的值，设计界面如图5.11所示。

图5.11　设计界面图

具体操作步骤如下：

（1）以5.1.2节中新建一个网站http:

//localhost/Website/为例。

（2）在网站中，添加窗体文件HiddenField.aspx，使用fieldset与legend标签对表单内容分组，页面中的样式表也使用StyleSheet.css样式表。

（3）在HiddenField.aspx文件的设计视图，从工具箱中拖拽一个HiddenField控件、一个文本框控件、一个Button控件和一个标签控件，如图5.12所示。

图5.12　HiddenField.aspx设计界面图

（4）HiddenField.aspx文件控件的属性，如表5.5所示。

表5.5HiddenField.aspx文件包含的控件及属性

控件类别

控件名

控件标识

属性

属性值

备注

Web控件

HiddenField

ValueHiddenField

Value

ASP.NET程序设计

Web控件

TextBox

TextBox_value

—

—

Web控件

Button

Button1

Text

更改隐藏控件的值

Web控件

Label

label1

—

—

DOCUMENT

Title

示例5-3

窗口的标题

StyleSheet

StyleSheet.css

链接的样式表

　（7）编写有关控件的事件代码。

HiddenField.aspx文件完整的后台代码如下：

protectedvoidPage_Load（objectsender,EventArgse）

{

if（!

Page.IsPostBack）

{

label1.Text="HiddenField控件的初始值是：

"+ValueHiddenField.Value;

}

}

protectedvoidButton1_Click（objectsender,EventArgse）

{

ValueHiddenField.Value=TextBox_value.Text.ToString（）;

label1.Text="HiddenField控件的值是：

"+TextBox_value.Text;

}

运行HiddenField.aspx，如图5.13所示，在文本框中输入“计算机科学与工程系”，然后通过单击“更改隐藏控件的值”按钮，把这个值赋值给隐藏字段，运行效果如图5.14所示。

图5.13　运行效果图

图5.14　运行效果图

5.4　ImageMap控件

5.4.1　ImageMap控件简介

ImageMap控件是一个让你可以在图片上定义热点（HotSpot）区域的服务器控件。

用户可以通过点击这些热点区域进行回发（PostBack）操作或者定向（Navigate）到某个URL位址。

该控件一般用在需要对某张图片的局部范围进行互动操作时，其主要属性有HotSpotMode、HotSpots和主要操作Click。

1．HotSpotMode热点模式属性

HotSpotMode热点模式，对应枚举类型System.Web.UI.WebControls.HotSpotMode。

其选项及说明如下：

（1）NotSet：

未设置项。

虽然名为未设置，但其实默认情况下会执行定向操作，定向到你指定的URL位址去。

如果你未指定URL位址，那默认将定向到自己的Web应用程序根目录。

（2）Navigate：

定向操作项。

定向到指定的URL位址去。

如未指定URL位址，那默认将定向到自己的Web应用程序根目录。

（3）PostBack：

回发操作项。

点击热点区域后，将执行后部的Click事件。

（4）Inactive：

无任何操作，即此时形同一张没有热点区域的普通图片。

2．HotSpots（图片热点）常用属性

该属性对应着System.Web.UI.WebControls.HotSpot对象集合。

HotSpot类是一个抽象类，它之下有CircleHotSpot（圆形热区）、RectangleHotSpot（方形热区）和PolygonHotSpot（多边形热区）三个子类。

实际应用中，都可以使用上面三种类型来定制图片的热点区域。

如果需要使用到自定义的热点区域类型时，该类型必须继承HotSpot抽象类。

同时，ImageMap最常用的事件有Click，通常在HotSpotMode为PostBack时用到。

当需要设置HotSpots属性时，可以可视化设置，如图5.15所示。

图5.15可视化设置HotSpots属性

5.4.2　应用案例

程序ImageMap.aspx中，使用ImageMap控件定义热点功能，设计界面如图5.16所示。

图5.16　设计视图

具体操作步骤如下：

（1）以5.1.2节中新建一个网站http:

//localhost/Website/为例。

（2）在网站中，添加窗体文件ImageMap.aspx，使用fieldset与legend标签对表单内容分组，页面中的样式表也使用StyleSheet.css样式表。

（3）在ImageMap.aspx文件的设计视图，从工具箱中拖拽一个ImageMap控件和一个标签控件，ImageMap控件的热点A区设置如图5.17所示，B区与C区的热点设置与此相同。

图5.17　HotSpot集合编辑器设置

（4）ImageMap.aspx文件控件定义代码如下：

ImageMapID="ImageMap1"runat="server"ImageUrl="~/img/Category.gif"　OnClick="ImageMap1_Click"HotSpotMode="PostBack">

CircleHotSpotAlternateText="A区"HotSpotMode="PostBack"PostBackValue="A"Radius="25"X="99"Y="100"/>

RectangleHotSpotAlternateText="B区"Bottom="175"Left="125"Right="150"Target="_blank"Top="120"HotSpotMode="PostBack"PostBackValue="B"/>

CircleHotSpotAlternateText="C区"HotSpotMode="PostBack"PostBackValue="C"Radius="20"X="180"Y="120"/>

ImageMap>

LabelID="LabMege"runat="server">

Label>

（6）在ImageMap.aspx文件设计视图中，双击ImageMap控件，ImageMap单击事件的后台代码如下：

protectedvoidImageMap1_Click（objectsender,ImageMapEventArgs