21.7  弹出式日历选择功能

弹出式日历选择功能是Web窗体页上一种非常实用的功能。用户从日历控件中选择日历，从而保证了用户输入日历格式的有效性。

实现目标

本实例介绍使用ASP.NET AJAX中的CalendarExtender控件为文本输入框实现弹出式日历选择的功能。

技术实现

创建AjaxCalendar.aspx页面

在Sample_21应用程序中创建AjaxCalendar.aspx页面，并在该页面上创建一个ScriptManager控件、一个UpdatePanel控件、一个TextBox控件和一个CalendarExtender控件。这些控件的ID属性的值分别为sm、up、tbValue和ceValue。其中，sm和up控件共同提供无刷新的Web环境。tbValue控件供用户输入值。当用户鼠标单击tbValue控件时，ceValue控件将弹出一个可以选择日期的日历控件。AjaxCalendar.aspx页面的部分HTML设计代码如下：

<%@ Page Language="C#" AutoEventWireup="true"

StylesheetTheme="Aspnet3DBWeb"

CodeFile="LinqProcedure.aspx.cs" Inherits="LinqProcedure" %>

把AjaxCalendar.aspx页面设置为Sample_21应用程序的起始页面，并运行该应用程序。鼠标单击AjaxCalendar.aspx页面中的输入框，将弹出一个可以选择日期的日历控件，如图21-13所示。

 

图21-13  AjaxCalendar.aspx页面实现弹出式日历选择功能