第4章高级服务器控件

第4章　高级服务器控件

ASP.NET中的服务器控件除了基本控件外，还有一些复杂的Web服务器控件。ASP.NET 4.5包含很多高级控件，如数据绑定控件、导航控件和安全控件等。在Visual Studio 2012开发环境的工具箱的“标准”选项卡中具有几个高级控件：Calendar控件、AdRotator控件、MultiView控件、View控件、Wizard控件和FileUpload控件。本章我们来详细学习这几种高级服务器控件。

4.1　日历控件Calendar

Calendar日历控件用来在Web页面上显示一个日历，允许用户选择年、月、日或选择一个日期的范围。本节主要介绍日历控件。

4.1.1　日历控件简介

知识点讲解：光盘\视频讲解\第4章\日历控件简介.wmv

Calendar控件默认呈现为一个日历形式，可以实现两种功能：查看和选择日期、在日历网格中显示约会或其他的信息。日历控件的使用方法很简单，在Visual Studio 2012工具箱的“标准”选项卡中，将Calendar控件拖到Web页面即可。日历控件中具有年月信息、星期列表及月份中所有的日期列表。

将日历控件从工具箱拖到Web页面上后，可以使用由Visual Studio 2012提供的智能标签功能来为它应用预定义的样式。在设计视图中单击Calendar控件右上角的智能标签，在弹出的Calendar任务菜单中选择“自动套用格式”命令，打开如图4.1所示的“自动套用格式”对话框，选择一种Visual Studio 2012内置的格式。

图4.1　“自动套用格式”对话框

Calendar控件中的每个日期都是一个LinkButton控件。当在日历控件中选择某个日期后，将会触发PostBack，引起页面回发，服务器端会响应SelectionChanged事件，并且当前选择的日期会高亮显示。默认情况下，日历控件只允许单选，在SelectionChanged事件中使用SelectedDate属性来控制选择的方式。SelectionChanged是一个枚举值，提供的选项有Day、DayWeek、DayWeekMonth和None。设置不同的选项后，Calendar控件的外观会发生一些变化。SelectionChanged各选项具体说明如下所示。

• Day：可以选择单个日期。
• DayWeek：可以选择单日或者整周。
• DayWeekMonth：可以选择单个日期、周或整月。
• None：不能选择任何日期。

当将SelectionChanged属性设置为DayWeekMonth后，它会添加一些链接来允许选择整周或者整月，运行效果如图4.2所示。

图4.2　SelectionChanged属性设置为DayWeekMonth效果

【示例4-1】下面创建一个名称为Calendar的网站，并在该网站中添加一个名称为“Calendar日历控件”的Web窗体。在Web窗体上添加一个面板控件，一个TextBox控件，一个Button控件，一个Calendar控件。它们都是服务器控件，具有runat=“server”标记。代码如下：

当选择一个日期时，将触发它的AutoPostBack属性，同时会引发服务器端的SelectionChanged事件并执行事件中的代码，在TextBox控件中显示出所选择的日期内容。按钮的单击事件和日历控件的SelectionChanged事件代码如下：

运行结果如图4.3～图4.5所示。

图4.3　选择单个日期	图4.4　选择整周	图4.5　选择整月

在该示例中，当选择单个日期时，将在文本框控件中显示当前选择的日期；当选择>链接时，将选中整周；当选择>>链接时，将选择整月。当选中部分日期时，该部分日期会高亮显示。

默认情况下，日历控件将当前服务器中的日期作为其显示日期。可以使用Calendar控件的TodaysDate属性指定其他的日期来更改浏览器显示的当前日期。当日历控件的SelectionMode属性设置为DayWeek或者DayWeekMonth时，除SelectedDate之外，还可以使用SelectedDates属性来获取选择的多个日期。

注意：SelectedDate属性和SelectedDates集合密切相关。当SelectionMode属性设置为Day时，SelectedDate和SelectedDates[0]的值相同，且SelectedDates.Count为1。当SelectionMode属性设置为DayWeek或DayWeekMonth时，SelectedDate和SelectedDates[0]的值相同。

4.1.2　限制显示和选择日期

知识点讲解：光盘\视频讲解\第4章\限制显示和选择日期.wmv

在编程中，有时希望限制某些日期，或者不允许用户选择某些日期，可以使用Calendar.DayRender事件来设置。当Calendar显示到页面上触发DayRender事件时，该事件可以改变日历控件的呈现。该事件提供了一个DayRenderEventArgs类型的参数，通过该参数的Day属性可以获取呈现在日历控件中的日期的信息。

DayRenderEventArgs.Day是一个CalendarDay类型的属性，提供了一些常用属性供开发人员使用。这些属性的具体描述如表4.1所示。

表4.1　CanlendarDay提供的属性

【示例4-2】下面创建一个名称为Calendar的网站，并在该网站中添加一个名称为“限制显示和选择日期”的Web窗体。在Web窗体上添加一个Calendar控件，它是服务器控件，具有runat=“server”标记。代码如下：

在日历控件中添加DayRender事件，该事件设置用户不能选择星期天和不属于本月的日期。日历控件的DayRender事件代码如下：

运行结果如图4.6所示。

图4.6　运行结果图

在该示例中，使用Day属性获取当前日期，使得用户不能选择星期天的日期。再使用Day属性获取不属于本月的日期，将其隐藏，显示为“-”字符。在第二个if语句中，使用了e.Cell属性过滤非本月日期的显示。

注意：e.Cell属性是TableCell类型，代表日历控件的一个日期列，可以使用它对列进行格式化或添加自定义的信息。

4.1.3　格式化显示日历控件

知识点讲解：光盘\视频讲解\第4章\格式化显示日历控件.wmv

开发人员可以在属性窗格中通过调整属性的值来设置Calendar控件的外观。这些样式属性包括DayStyle、DayHeaderStyle、NextPrevStyle、OtherMonthDayStyle、SelectedDayStyle、SelectorStyle、TitleStyle、TodayDayStyle和WeekendDayStyle等，它们的具体说明如表4.2所示。

表4.2　样式属性

【示例4-3】下面创建一个名称为Calendar的网站，并在该网站中添加一个名称为“格式化显示日历控件”的Web窗体，在Web窗体上添加一个Calendar控件，它是服务器控件，具有runat=“server”标记。代码如下：

运行结果如图4.7所示。

在该示例中，通过设置日历控件的各个属性的值来改变日历的外观。另外，开发人员还可以编程控制日历控件的格式。

图4.7　运行结果图

注意：日历控件的外观可以通过其属性的值来改变。

4.1.4　编程控制日期选择

知识点讲解：光盘\视频讲解\第4章\编程控制日期选择.wmv

Calendar控件允许用户选择单个日期或多个日期。当用户选择多个日期时，只能选择连续的整周或者整月的日期。Calendar控件还提供了SelectedDates属性，可以通过编程实现选择多个不连续的日期。SelectedDates是SelectedDatesCollection集合类型的属性，可以使用Add()、Remove()、Clear()和SelectRange()方法以编程的方式在SelectedDates集合中选定日期。

【示例4-4】下面创建了一个名称为Calendar的网站，并在该网站中添加一个名称为“编程控制日期选择”的Web窗体。在Web窗体上添加一个Calendar控件，它是服务器控件，具有runat=“server”标记。代码如下：

为该日历控件添加SelectionChanged事件，当选择日期时，日期背景颜色为淡绿色。同时为Button控件添加单击事件，使得可以同时选择多个日期。代码如下：

注意：选择多个不连续的日期时，运行后首先需要触发日历控件，即在日历控件上切换月份，再单击按钮。

运行结果如图4.8和图4.9所示。

图4.8　选择单个日期	图4.9　选择多个不连续的日期

在该示例中，单击按钮时，通过编程的方式在SelectedDates集合中选定本月中是星期三的日期。每个月中都可以选定所有是星期三的日期，实现了选择多个不连续的日期的功能。

4.2　广告控件AdRotator

AdRotator控件用于显示图像序列。ASP.NET自带的服务器控件AdRotator可以使ASP.NET中的广告随时显示出来。每次在进行页面刷新时，都会随机选择不同的广告条来显示。AdRotator控件的功能也可以用Image和页面代码实现，但是该控件提供了更多的控制项。

4.2.1　创建广告文件

知识点讲解：光盘\视频讲解\第4章\创建广告文件.wmv

在使用广告控件之前，需要准备要用作广告条的图片。可以在网站项目中创建一个图片文件夹，将图片资源存放在该文件夹下。然后创建一个XML格式的广告控件使用的广告列表信息文件，该文件包含用于显示广告图片的信息。最后在ASP.NET页面中创建一个AdRotator服务器控件，将广告XML文件连接到该控件上。

广告文件的根元素为Advertisements，每个子元素<Ad>用于代表一幅广告信息。<Ad>子元素包含了广告的详细信息。创建一个包含广告细节的XML文件，如ad.xml，它包含的元素如下所示。

• ImageUrl：包含被显示图像的URL，可以是绝对路径，也可以是相对于显示广告的页面的相对路径。
• NavigateUrl：包含目标Web站点的URL。
• Height：图像的高度。
• Width：图像的宽度。
• AlternateText：包含着一些文本，当鼠标移过图像时，作为提示信息显示出来。换句话说，这是广告图像中ALT元素的文本。
• Keyword：这个可选元素包含了广告所属的类别。这样就使各种类别的广告都在同一个XML中，然后使用AdRotator控件中的Keywordfilter属性在给定页面上对广告进行过滤。
• Impressions：指出广告的可能显示频率的数值。

创建广告文件时有一点值得特别注意的是，它是区分大小写的。因此其中所包含元素的大小写应该拼写正确，比如：应该使用<Ad>而不是<ad>。

【示例4-5】下面创建一个名称为AdRotator的网站，并创建一个类型为XML的广告列表信息文件ad.xml。再添加一个名称为Image的文件夹，存放图片资源。ad.xml文件的具体代码如下：

注意：XML文件可以不经授权被随意访问。因此，可以使用非.xml的扩展名对文件进行重命名或者将该文件存储在App_Data目录下。App_Data目录在Machine.config中配置为拒绝来自Internet的对任何类型文件的访问。

4.2.2　使用广告控件

知识点讲解：光盘\视频讲解\第4章\使用广告控件.wmv

创建好广告文件后，就可以使用广告控件AdRotator将广告文件在Web页面上显示出来。当用户每次刷新界面时，将会显示不同的广告信息。

【示例4-6】在示例4-5中配置好广告文件后，为了在页面上显示广告，需要在该网站中添加一个名称为“AdRotator广告控件”的Web窗体，在Web窗体上添加一个AdRotator控件，它是服务器控件，具有runat=“server”标记。代码如下：

然后再创建两个Web页面Default.aspx和Default2.aspx，用来放置广告信息。Default.aspx和Default2.aspx页面的关键代码如下：

运行结果如图4.10～图4.13所示。

图4.10　运行结果图（1）

图4.11　运行结果图（2）

图4.12　单击广告控件要定位的页面

图4.13　单击广告控件要定位的页面

在该示例中，运行程序后，随机显示一条广告信息。每次刷新页面时，将会显示不同的广告信息。单击图像，跳转到NavigateUrl标签指定的页面的URL。

注意：广告控件是随机出现的。

4.3　视图控件

在服务器控件中有三种视图控件：MultiView、View和Wizard控件。MultiView和Wizard控件是两个比较特别的控件，它们可以在一个页面上显示多个视图的内容。本节我们来学习这三种服务器视图控件。

4.3.1　MultiView和View控件

知识点讲解：光盘\视频讲解\第4章\MultiView和View控件.wmv

在实际生活中，大多数的Web站点都会将任务分割到几个页面中。这种任务分割的方式非常直观，便于编码，ASP.NET提供了多种状态管理机制来实现从一个页面向另一个页面传递信息。但有时希望显示相同数据的不同视图。MultiView控件的出现解决了多视图显示的问题。MultiView控件简化了实现多视图的操作，允许开发人员以声明的方式定义多个视图，并在同一时刻只显示一个视图。使用视图控件的好处如图4.14所示。

图4.14　使用视图控件的好处

MultiView控件由一组View控件组成。MultiView和View服务器控件用作其他控件和标记的容器，并提供了一种可方便地显示信息的替换视图的方式。将MultiView和View联合使用可以做出tab分栏效果。

MultiView控件类似于Windows Forms中的TabControl或者PageControl控件，作为一个容器可以定义多个视图的内容，而只显示一个视图。未选择某个View控件时，该控件不会呈现到页面中。但是，每次呈现页面时都会创建所有View控件中的所有Web服务器控件的实例，并且将这些实例的值存储为页面的视图状态的一部分。

【示例4-7】下面创建一个名称为MultiView的网站。

（1）添加一个名称为Images的文件夹，存放视图控件的图片资源。

（2）创建一个名为“MultiView视图控件”的Web窗体，在该窗体上添加一个DropDownList下拉列表框控件、一个按钮控件、一个MultiView控件和三个View子控件。然后在第一个View控件中添加一幅图片，在第二个View控件中添加一个日历控件，在第三个View控件中添加一个项目列表控件BulletedList。

具体代码如下：

为了能够在多个视图之间切换，添加了DropDownList控件，用于绑定到Views集合。Button控件用于实现在不同的视图之间进行切换，后置代码如下：

运行结果如图4.15～图4.17所示。

图4.15　运行结果图（1）	图4.16　运行结果图（2）	图4.17　运行结果图（3）

在本例中，使用下拉列表框控件DropDownList绑定到Views集合，单击“显示视图”按钮可以在不同的视图之间进行切换。视图1显示的是一张图片，视图2显示的是日历，视图3显示的是一个项目列表。

注意：MultiView控件不是一个命名容器，即不同的View控件中不能有相同名称的相同类型控件。且由于增加了多个View后，页面显示具有更大的体积和更多的代码需要处理。每个View的每个控件都要被添加到视图状态中，在页面回发时被重建，系统开销比较大。因此除非有特别的理由，否则请慎用该控件。

4.3.2　Wizard控件

知识点讲解：光盘\视频讲解\第4章\Wizard控件.wmv

Wizard控件是用于创建向导的复杂用户控件，它与MultiView控件类似，也显示多个视图。但Wizard控件支持更多较高级的功能，比如导航按钮、导航工具条、步骤链接、样式和模板等。下面我们来学习Wizard控件的详细知识点。

1. Wizard控件的属性、方法和事件

Wizard控件提供了很多属性，比较常用的如表4.3所示。

表4.3　Wizard控件提供的属性

Wizard控件在提供属性的同时，还提供了一些方法，允许编程进行导航。这些方法的具体说明如表4.4所示。

表4.4　Wizard控件提供的方法

当用户在Wizard控件中进行导航时，Wizard控件还触发了一些事件。这些事件的具体说明如表4.5所示。

表4.5　Wizard控件触发的事件

2. Wizard控件的向导页的设置

在Wizard控件中，每个向导页由一个WizardStep组成。Wizard控件包含一个WizardStepCollection控件的集合，其中包含由开发人员定义的每个步骤的用户界面。开发人员可以在属性窗格中选中WizardSteps，单击右侧的按钮，打开“WizardStep集合编辑器”对话框，如图4.18所示。

图4.18　WizardStep集合编辑器

在“WizardStep集合编辑器”对话框中，可以添加或移除指定类型的WizardStep对象，设置步骤的属性。WizardStep提供了以下属性。

• Title：提供步骤的描述性名称，将其作为一个链接显示在向导控件左边的SideBar栏上。
• StepType：提供指定步骤的类型。该属性决定导航按钮的类型，属于枚举类型。可选值为Start，显示一个“下一步”按钮；Step，显示“上一步”和“下一步”按钮；Finish，显示“完成”和“上一步”按钮；Complete，不显示按钮，并且隐藏SideBar；Auto，根据在集合中的上下位置进行推断类型，默认值为Auto。
• AllowReturn：指定用户是否能返回到这一步骤。一旦用户经过这一步，将不能再跳回到这步，SideBar的链接也不受影响。

Wizard控件可以通过线性导航和非线性导航收集数据。例如跳过不需要的步骤或者返回前面已经完成的步骤来更改某个值就属于非线性导航。Wizard控件可以保存它在各步骤之间的状态，以便在所有步骤完成之前，无须将某个步骤中输入的数据保存到数据存储区中。

注意：在所有步骤完成之前，输入的数据不会存储到数据存储区中。

3. Wizard控件的样式和模板

Wizard控件允许开发人员自定义其外观。当选中控件后在属性窗格中可以调整每个按钮的呈现。比如“上一步”按钮，可以设置它的Type、Text和Style属性。Type属性的可选值有三个，分别是Button、Image和Link；Text属性用于指定按钮显示的文本；Style属性用于指定按钮的样式。

Wizard控件提供了很多以Style结尾的样式属性，以控制Wizard控件的细节显示。这些属性的具体说明如表4.6所示。

表4.6　Wizard控件的样式属性

如果属性和样式还没能满足定制的需求，Wizard控件还提供了一些用于定制外观的模板，这些模板的具体内容如表4.7所示。

表4.7　Wizard控件的模板

学了这么多关于Wizard控件的知识，我们来看一个示例。该示例运用讲解的有关Wizard控件的知识点，帮助读者实际了解Wizard控件的使用方法。

【示例4-8】下面使用Wizard控件创建一个简单的用户注册向导。

（1）创建一个名称为Wizard的网站。

（2）创建一个名为“Wizard视图控件”的Web窗体。在该窗体上添加一个Wizard控件。然后在第一个向导页中添加一个文本框，两个单选按钮，用于输入个人的姓名和性别。在第二个向导页中添加两个文本框控件，用于输入用户名和密码。在第三个向导页中添加四个标签控件，用于显示输入的各种信息。

具体代码如下：

将Wizard控件的ActiveStepIndex属性设置为0，表示将显示第一个WizardStep。在三个向导页中，每个都具有不同的StepType。第一个设置为Start，显示“下一步”按钮；第二个设置为Step，显示“上一步”和“下一步”按钮；第三个设置为Finish，显示“上一步”和“完成”按钮。可以单击“上一步”和“下一步”按钮在各个向导页之间进行导航，也可以单击侧边栏的链接来进行导航。在用户注册向导示例中，通过响应事件，来记录用户在向导页中输入的数据，并且在用户单击“完成”按钮时，提示用户已经成功注册。后置代码如下：

运行结果如图4.19～图4.21所示。

图4.19　运行结果图（1）

图4.20　运行结果图（2）

图4.21　运行结果图（3）

该示例实现了一个简单的用户注册向导。在该示例中，调用相应的属性设置了Wizard控件的样式，编写相应的事件来响应导航。其中注册的姓名为小米，性别为女，用户名为xiaomi，密码为888888。在信息汇总部分将会显示出这些信息。

4.4　文件上传控件FileUpload

文件上传控件FileUpload实现的功能是将文件上传到服务器。本节我们来学习如何使用FileUpload控件上传文件，以及上传大文件和一种上传多个文件的方法。

4.4.1　使用FileUpload控件上传文件

知识点讲解：光盘\视频讲解\第4章\使用FileUpload控件上传文件.wmv

当用户使用FileUpload控件选定要上传的文件，然后提交时，该文件将作为请求的一部分进行上传。即当页面提交时，客户端将同时完成向服务器上传文件的过程，用户可以看到浏览器进度条的前进，进度条前进速度的快慢由文件大小决定。文件上传完成后，文件被完整缓存在服务器内存中。文件上传完成后页面代码才开始运行。此时可以使用FileUpload的一些属性和方法来访问和保存上传的文件。FileUpload控件提供了一些属性供开发人员使用，这些属性具体说明如表4.8所示。

表4.8　FileUpload控件属性

PostedFile属性是HttpPostedFile类型的对象，用于向用户提供一些关于已经上传的文件信息。PostedFile对象公开的属性如下所示。

• ContentLength：允许获取以字节为单位的上传文件的尺寸。
• ContentType：允许获取上传文件的MIME类型。
• FileName：允许获取上传文件的文件名。
• InputStream：允许获取上传文件的文件流。

除了属性，FileUpload控件还支持一些方法。这些方法的具体说明如表4.9所示。

表4.9　FileUpload控件方法

【示例4-9】下面使用FileUpload控件来演示文件的上传。

（1）创建一个名称为“FileUpload控件”的网站。

（2）创建一个名为“FileUpload文件上传控件”的Web窗体，在该窗体上添加一个FileUpload控件，一个按钮控件，一个标签控件。

（3）添加一个名为UploadedImages的文件夹，用来存放上传的图像文件。

具体代码如下：

添加了FileUpload控件后，出现一个文本框和一个按钮。需要添加一个上传文件的按钮，执行将文件上传到服务器缓存的动作。为Button控件添加验证文件的代码，如果是图像文件，保存到文件系统中，否则提示文件类型不可接受。具体代码如下：

运行结果如图4.22所示。

图4.22　运行结果图

在该示例中，按钮的单击事件分为三步。首先检查FileUpload控件的HasFile属性，判断该控件是否包含上传文件。然后检查上传文件的扩展名是否和设定的扩展名匹配，若匹配则上传，否则不允许上传。最后将文件保存到UploadedImages文件夹中，并在标签控件中显示文件上传成功和文件名、文件大小等信息。

注意：在上传文件的时候可以同时获得文件信息并将其显示出来。

4.4.2　上传大文件

知识点讲解：光盘\视频讲解\第4章\上传大文件.wmv

在默认情况下，FileUpload控件支持上传文件的大小是4MB（4096KB）。限制上传文件大小的目的是保护应用程序（如恶意用户上传大文件，来占有服务器端资源）。如果需要上传大的文件，可以在web.config配置文件中添加<httpRuntime>配置。

在<httpRuntime>配置中设置maxRequestLength和requestLengthDiskThreshold属性的值。这两个属性的具体描述如下所示。

• maxRequestLength：设置服务器可以接收文件的最大限制，默认值为4096KB。
• requestLengthDiskThreshold：设置决定服务器端可以缓存多大数量的Form提交。ASP.NET 4.5允许开发人员将大文件缓存到文件系统中，即ASP.NET临时文件夹中。

注意：requestLengthDiskThreshold的设置值必须小于maxRequestLength的值。

【示例4-10】下面使用FileUpload控件来演示大文件的上传。

（1）创建一个名称为“FileUpload上传大文件”的网站。

（2）创建一个名为“FileUpload上传大文件示例”的Web窗体。在该窗体上添加一个FileUpload控件，一个按钮控件，一个标签控件。

（3）添加一个名为UploadedMusic的文件夹，用来存放上传的音乐文件。

具体代码如下：

添加了FileUpload控件后，出现一个文本框和一个按钮。需要添加一个上传大文件的按钮，执行将文件上传到服务器的缓存的动作。我们为Button控件添加验证文件的代码，如果是音乐文件，保存到文件系统中，否则提示文件类型不可接受。具体代码如下：

为了支持大文件的上传，需要在web.config配置文件的<httpRuntime>配置中设置maxRequestLength和requestLengthDiskThreshold属性的值。具体代码如下所示：

运行结果如图4.23所示。

图4.23　运行结果图

在该示例中，将maxRequestLength属性设置为10240，即10MB。将requestLengthDiskThreshold属性设置为100KB，即当文件缓冲大于100KB时，将其缓存到磁盘中。

4.4.3　一次上传多个文件

知识点讲解：光盘\视频讲解\第4章\一次上传多个文件.wmv

在开发中，有时需要一次上传多个文件，而ASP.NET并没有内置从单个页面上传多个文件的能力。因此，开发人员需要结合位于System.IO命名空间的类和HttpPostedFile类，捕获Request对象发送的所有文件，这样就可以实现一次上传多个文件的功能。

【示例4-11】下面使用FileUpload控件来演示一次上传多个文件。

（1）创建一个名称为“FileUpload一次上传多个文件”的网站。

（2）创建一个名为“FileUpload一次上传多个文件示例”的Web窗体。在该窗体上添加两个FileUpload控件；一个按钮控件，一个标签控件。

（3）添加一个名为UploadedFiles的文件夹，用来存放上传的文件。

具体代码如下：

添加了两个FileUpload控件后，出现两个文本框和两个按钮。需要添加一个上传文件的按钮，执行将文件上传到服务器的缓存的动作。我们为Button控件添加单击事件，具体代码如下：

运行结果如图4.24所示。

图4.24　运行结果图

注意：使用FileUpload控件可以实现一次上传多个文件的功能。

4.5　小结

本章主要介绍了ASP.NET的高级服务器控件，包括日历控件Calendar、广告控件AdRotator、视图控件和文件上传控件等。重点是日历控件、视图控件和文件上传控件的掌握，难点在于广告控件。有兴趣的读者可以尝试着在自己制作的网站中添加高级服务器控件，以使自己的网站更加完美。

4.6　本章习题

习题4-1　在Visual Studio 2012中新建一个网站，命名为chapter4_1。在该网站上添加一个Web页面，命名为Default.aspx。在该Web页面上添加一个Calendar日历控件并在设计视图中为该控件套用“专业型2”格式。运行结果如图4.25所示。

图4.25　运行结果图

【分析】本题目主要考查的是对日历控件的掌握情况。

注意：该题目在日历控件的设计视图中套用格式。

习题4-2　在Visual Studio 2012中新建一个网站，命名为chapter4_2。在该网站上添加一个Web页面，命名为Default.aspx。在该页面中添加一个Calendar日历控件，为该控件套用“专业型2”格式。并在代码后置文件中对日历控件进行设置，使得可以选择多个不连续的日期。运行结果如图4.26和图4.27所示。

图4.26　运行结果图（1）	图4.27　运行结果图（2）

【分析】本题目主要考查的是对编程控制日期选择的掌握情况。

【关键代码】Default.aspx页面后置代码如下：

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }
    protected void Calendar1_SelectionChanged(object sender, EventArgs e)
    {
        TextBox1.Text = "选择的日期是:" + Calendar1.SelectedDate.ToString("yyyy-MM-dd");
        Calendar1.SelectedDayStyle.BackColor = Color.Green ;
        Calendar1.SelectedDayStyle.BorderColor = Color.Gray;
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        int Day = Calendar1.VisibleDate.Day;
        int Month = Calendar1.VisibleDate.Month;
        int Year = Calendar1.VisibleDate.Year;
        Calendar1.SelectedDates.Clear();
        for (int i = 1; i < System.DateTime.DaysInMonth(Year, Month); i++)
        {
            DateTime Date = new DateTime(Year, Month, i);
            if (Date.DayOfWeek == DayOfWeek.Sunday)
                Calendar1.SelectedDates.Add(Date);
        }
        TextBox1.Text = "本月周日的数量是：" + Calendar1.SelectedDates.Count.ToString();
    }
}

注意：对于选择多个不连续的日期，需要先单击上个月或者下个月日期的链接，触发页面，再单击“选择”按钮，才可以选择多个不连续的日期。

习题4-3　在Visual Studio 2012中新建一个网站，命名为chapter4_3。在该网站上添加三个Web页面，分别命名为Default.aspx、Default2.aspx、Default3.aspx。在Default.aspx页面上添加一个AdRotator广告控件、一个XmlDataSource控件。然后创建一个广告文件XMLFile.xml。运行Default.aspx页面结果如图4.28～图4.31所示。

图4.28　运行结果图（1）

图4.29　运行结果图（2）

图4.30　运行结果图（3）

图4.31　运行结果图（4）

【分析】本题目主要考查的是对广告控件AdRotator的掌握情况。

【关键代码】广告文件XMLFile.xml代码如下：

<?xml version="1.0" encoding="utf-8" ?>
<Advertisements>
  <Ad>
    <ImageUrl>~/Images/11.jpg</ImageUrl>
    <NavigateUrl>~/Default2.aspx</NavigateUrl>
    <AlternateText>菊花</AlternateText>
    <Impressions>50</Impressions>
    <Keyword>菊花</Keyword>
  </Ad>
  <Ad>
    <ImageUrl>~/Images/12.jpg</ImageUrl>
    <NavigateUrl>~/Default3.aspx</NavigateUrl>
    <AlternateText>企鹅</AlternateText>
    <Impressions>50</Impressions>
    <Keyword>企鹅</Keyword>
  </Ad>
</Advertisements>

注意：在Default.aspx页面上为XmlDataSource控件选择数据源为XMLFile.xml，并在Default2.aspx和Default3.aspx文件中添加相应图片。

习题4-4　在Visual Studio 2012中新建一个网站，命名为chapter4_4。首先在该网站上添加一个名为Images的文件夹，用来存放图片信息。然后在该网站上添加一个Web页面，命名为Default.aspx。在该页面上添加一个DropDownList列表框控件、一个Button控件、一个MultiView控件和两个View控件，实现两个视图的切换，运行结果如图4.32和图4.33所示。

图4.32　运行结果图（1）	图4.33　运行结果图（2）

【分析】本题目主要考查的是对视图控件MultiView和View控件的掌握程度。

【关键代码】Default.aspx页面后置代码如下：

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!Page.IsPostBack)
        {
            DropDownList1.DataSource = MultiView1.Views;
            DropDownList1.DataTextField = "ID";
            DropDownList1.DataBind();
        }
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        MultiView1.ActiveViewIndex = DropDownList1.SelectedIndex;
    }
}

注意：View控件需要嵌入MultiView控件中。

习题4-5　在Visual Studio 2012中新建一个网站，命名为chapter4_5。首先在该网站上添加一个名为Upload的文件夹，用来存放上传成功的文件。然后在该网站上添加一个Web页面，命名为Default.aspx。在该页面上添加一个FileUpload控件、一个Button控件和一个Label控件。上传文件类型限定为.doc或者.docx。运行结果如图4.34所示。

图4.34　运行结果图

【分析】本题目主要考查的是对文件上传控件FileUpload的掌握程度。

【关键代码】Default.aspx页面后置代码如下：

public partial class _Default : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {
    }
    protected void Button1_Click(object sender, EventArgs e)
    {
        Boolean file = false;
        String path = Server.MapPath(“~/Upload/”);
        if (FileUpload1.HasFile)
        {
            String fileExtension = System.IO.Path.GetExtension(FileUpload1.FileName).ToLower();
            String[] a = { “.docx”, “.doc” };
            for (int i = 0; i < a.Length; i++)
            {
                if (fileExtension == a[i])
                    file = true;
            }
            if (file)
            {
                try
                {
                    FileUpload1.PostedFile.SaveAs(path + FileUpload1.FileName);
                    Label1.Text = “文件已上传成功！<br>” + “上传文件名为：” + FileUpload1.FileName + “<br>文件的大小为：” + FileUpload1.PostedFile.ContentLength / 1024 + “KB”;
                }
                catch (Exception ex)
                {
                    Label1.Text = “文件上传失败！原因是：” + ex.Message;
                }
            }
            else
            {
                Label1.Text = “不可接受的文件类型！”;
            }
        }
    }
}