asp.net Ajax--Calendar控件使用

======================================================
注：本文源代码点此下载
======================================================

简介     

calendar控件是一个很简单的控件,主要用来在页面中提供日历的选择,其实现在已经有很多用javascript写的日历控件,但是canlendar日历控件能够让我们更快速地来实现这种效果,只需要进行一些简单的设置即可。

重要属性

targetcontrolid:用来显示选择日期的控件,改控件必需为textbox

cssclass:设置日历的样式

format:显示日期的格式,如yymmdd,会显示071105

popupbuttonid:当日期是通过选定某个按钮弹出的时候,为改按钮的id,一般为一个日历图片

    

示例1

1.打开visual studio2005,新建一个ajaxcontroltoolkit网站。

2.在网站根目录下添加一个窗体,命名为calendar1.aspx。

3.切换到设计视图,在页面上添加scriptmanger,一个textbox和一个calendarentender控件。

4.设置calendarextender控件的属性如下:

cc1:calendarextender targetcontrolid="txtdate" runat="server"

format="yymmdd" id="caldate"cssclass="mycalendar"/>

下面是样式代码,对应上面的cssclass,关于改样式的解释在后面讲到:

style type="text/css">

.mycalendar .ajax__calendar_container

{

border:1px solid #646464;

background-color:#faac38;

}

.mycalendar .ajax__calendar_other .ajax__calendar_day,

.mycalendar .ajax__calendar_other .ajax__calendar_year

{

color:#ffffff;

}

.mycalendar .ajax__calendar_hover .ajax__calendar_day

{

color:red;

background-color:#e8e8e8;

}

.mycalendar .ajax__calendar_active .ajax__calendar_day

{

color:blue;

font-weight:bolder;

background-color:#e8e8e8;

}

style>

5.保存设计,f5运行,当文本框控件获得焦点时就会弹出日历控件,选择日期后所选日期会按照所设定的格式显示在文本框中,然后日历控件会自动隐藏。

    

示例2

这个例子是单击一个图片按钮后会弹出日历控件,这个在网站中也是经常用到的

1.在网站的根目录下新建一个web窗体,命名为calendar2.aspx.

2.步骤和上面的一样,只是在页面中多了一个image控件,calendar控件的设置如下:

cc1:calendarextender targetcontrolid="txtdate" runat="server" format="yymmdd"

id="caldate"popupbuttonid="imgdate" cssclass="mycalendar"/>

设置基本上和上一个示例一样,多了一个popupbuttonid,用来制定点击的图片

3.保存设计,按f5运行,当单击日历图片时会弹出日历控件,选择了日期,控件会隐藏,选择的日期会显示在文本框中。

注:属性format用来控制日期显示的格式,但要注意代表月的m一定要大写,如:yyyy-mm-dd,yyyy/m/d,yyyy年mm月dd日

cssclass说明:

.ajax_calendar_container:日历控件的整体内容部分

.ajax_calendar_footer:日历控件的页脚部分

.ajax_calendar_header:日历控件的页眉部分

.ajax_calendar_activa .ajax_calendar_day:选中日期时的样式,一般选择过的日期会以另一种颜色显示。

.ajax_calendar_hover .ajax_calendar_day:鼠标划过日期时的样式,一般改变悬停在的日期的前景色和背景色。

.ajax_calendar_other .ajax_calendar_day:非本月日期的样式名

======================================================
在最后，我邀请大家参加新浪APP，就是新浪免费送大家的一个空间，支持PHP+MySql，免费二级域名，免费域名绑定 这个是我邀请的地址，您通过这个链接注册即为我的好友，并获赠云豆500个，价值5元哦！短网址是http://t.cn/SXOiLh我创建的小站每天访客已经达到2000+了，每天挂广告赚50+元哦，呵呵，饭钱不愁了，\(^o^)/