IDC资讯中心
最近常有朋友问起这样一个问题：在asp.net里如何做到当需要调用calendar时，就让它显示，选择完时间后让它自动隐藏，并返回一个日期字符串到文本输入框内。
曾经我看到网上流行的一个用vb.net写的usercontrol实现了这部分功能，在这里我把它改成c#的版本，供需要的朋友下载学习。
总的来说这个功能分两步，第一步建立一个usercontrol控件：
它的代码如下(popupcalendar.ascx)：
<%@ control language=”c#” autoeventwireup=”false” codebehind=”popupcalendar.ascx.cs” inherits=”calendarexample.popupcalendar” targetschema=”http://schemas.microsoft.com/intellisense/ie5″ %>
<asp:panel id=”pnlcalendar” style=”z-index: 101; left: 0px; position: absolute; top: 0px” width=”301px” height=”163px” runat=”server”>
<asp:calendar id=”calendar1″ width=”307px” height=”164px” runat=”server” backcolor=”white” bordercolor=”black” borderstyle=”solid” nextmonthtext=”<img src=”monthright.gif” border=”0″>” prevmonthtext=”<img src=”monthleft.gif” border=”0″>”>
<todaydaystyle backcolor=”#ffffc0″></todaydaystyle>
<daystyle font-size=”8pt” font-names=”arial”></daystyle>
<dayheaderstyle font-size=”10pt” font-underline=”true” font-names=”arial” borderstyle=”none” backcolor=”#e0e0e0″></dayheaderstyle>
<selecteddaystyle font-size=”8pt” font-names=”arial” font-bold=”true” forecolor=”white” backcolor=”navy”></selecteddaystyle>
<titlestyle font-size=”10pt” font-names=”arial” font-bold=”true” forecolor=”white” backcolor=”navy”></titlestyle>
<othermonthdaystyle forecolor=”gray”></othermonthdaystyle>
</asp:calendar>
</asp:panel>
对就的codebehind文件如下(popupcalendar.ascx.cs)：
namespace calendarexample
{
using system;
using system.data;
using system.drawing;
using system.web;
using system.web.ui.webcontrols;
using system.web.ui.htmlcontrols;
/// <summary>
/// popupcalendar 的摘要说明。
/// </summary>
public abstract class popupcalendar : system.web.ui.usercontrol
{
protected system.web.ui.webcontrols.calendar calendar1;
protected system.web.ui.webcontrols.panel pnlcalendar;
private void page_load(object sender, system.eventargs e)
{
// 在此处放置用户代码以初始化页面
}
#region web form designer generated code
override protected void oninit(eventargs e)
{
//
// codegen：该调用是 asp.net web 窗体设计器所必需的。
//
initializecomponent();
base.oninit(e);
}
/// 设计器支持所需的方法 – 不要使用
/// 代码编辑器修改此方法的内容。
/// </summary>
private void initializecomponent()
{
this.calendar1.selectionchanged += new system.eventhandler(this.calendar1_selectionchanged);
this.load += new system.eventhandler(this.page_load);
}
#endregion
public void displaycalendar( string scaltooltext, datetime dselecteddate, string sdatefieldname , int itop , int ileft )
{
if (pnlcalendar.visible == false)
{
pnlcalendar.style[“top”] = itop.tostring ();
pnlcalendar.style[“left”] = ileft.tostring ();
calendar1.selecteddate = dselecteddate;
calendar1.visibledate = dselecteddate;
calendar1.tooltip = scaltooltext;
calendar1.attributes[“selectedfield”] = sdatefieldname;
pnlcalendar.visible = true;
}
else
hidecalendar();
}
public void hidecalendar()
{
pnlcalendar.visible = false;
}
private void calendar1_selectionchanged(object sender, system.eventargs e)
{
textbox txtdate;
txtdate = (textbox)page.findcontrol(calendar1.attributes[“selectedfield”]);
txtdate.text = calendar1.selecteddate.toshortdatestring();
hidecalendar();
}
}
}
第二步，在asp.net文件里调用这个usercontrol；
它的代码如下(dispcalendar.aspx)：
<%@ register tagprefix=”sk” tagname=”popupcalendar” src=”popupcalendar.ascx”%>
<%@ page language=”c#” codebehind=”dispcalendar.aspx.cs” autoeventwireup=”false” inherits=”calendarexample.webform1″ %>
<!doctype html public “-//w3c//dtd html 4.0 transitional//en” >
<html>
<head>
<title>webform1</title>
<meta content=”microsoft visual studio 7.0″ name=”generator”>
<meta content=”c#” name=”code_language”>
<meta content=”javascript” name=”vs_defaultclientscript”>
<meta content=”http://schemas.microsoft.com/intellisense/ie5″ name=”vs_targetschema”>
</head>
<body ms_positioning=”gridlayout”>
<form id=”form1″ method=”post” runat=”server”>
<sk:popupcalendar id=”mycalendar” runat=”server”></sk:popupcalendar>
<table>
<tr>
<td width=”75″>
select date:
</td>
<td>
<asp:textbox id=”txtstartdate” runat=”server” width=”86px”></asp:textbox>
</td>
<td>
<asp:imagebutton id=”button1″ runat=”server” imageurl=”calendar.gif”></asp:imagebutton>
</td>
</tr>
</table>
</form>
</body>
</html>
对应的codebehind文件如下(dispcalendar.aspx.cs)：
using system;
using system.collections;
using system.componentmodel;
using system.data;
using system.drawing;
using system.web;
using system.web.sessionstate;
using system.web.ui;
using system.web.ui.webcontrols;
using system.web.ui.htmlcontrols;
namespace calendarexample
{
/// <summary>
/// webform1 的摘要说明。
/// </summary>
public class webform1 : system.web.ui.page
{
protected system.web.ui.webcontrols.textbox txtstartdate;
protected system.web.ui.webcontrols.imagebutton button1;
protected popupcalendar mycalendar;
private void page_load(object sender, system.eventargs e)
{
if (!ispostback)
mycalendar.hidecalendar();// 在此处放置用户代码以初始化页面
}
#region web form designer generated code
override protected void oninit(eventargs e)
{
//
// codegen：该调用是 asp.net web 窗体设计器所必需的。
//
initializecomponent();
base.oninit(e);
}
/// <summary>
/// 设计器支持所需的方法 – 不要使用代码编辑器修改
/// 此方法的内容。
/// </summary>
private void initializecomponent()
{
this.button1.click += new system.web.ui.imageclickeventhandler(this.button1_click);
this.load += new system.eventhandler(this.page_load);
}
#endregion
private void button1_click(object sender, system.web.ui.imageclickeventargs e)
{
datetime dseldate;
try
{
dseldate=datetime.parse(txtstartdate.text);
}
catch
{
dseldate=datetime.now;
}
mycalendar.displaycalendar(“select a start date”, dseldate,”txtstartdate”, 22, 215);
}
}
}
