在ASP.NET中实现弹出日历的具体方法
程序员文章站
2024-03-01 22:43:34
ctlcalendar.ascx的源代码:复制代码 代码如下:<%@ control language="c#" autoeventwireup="false" co...
ctlcalendar.ascx的源代码:
<%@ control language="c#" autoeventwireup="false" codebehind="ctlcalendar.ascx.cs" inherits="calendar.ctlcalendar" targetschema="http://schemas.microsoft.com/intellisense/ie5" enableviewstate="true"%>
<asp:textbox id="textbox1" runat="server"></asp:textbox>
<input type="button" id="button1" runat="server" value="..."><br>
<asp:panel id="pnlcalendar" runat="server" style="position: absolute">
<asp:calendar id="calendar1" runat="server" firstdayofweek="monday" showgridlines="true" backcolor="white"
daynameformat="full" forecolor="black" font-size="8pt" font-names="verdana" bordercolor="#999999"
cellpadding="4" width="200px" height="180px">
<todaydaystyle forecolor="black" backcolor="#cccccc"></todaydaystyle>
<selectorstyle backcolor="#cccccc"></selectorstyle>
<daystyle wrap="false" borderstyle="dashed"></daystyle>
<nextprevstyle verticalalign="bottom"></nextprevstyle>
<dayheaderstyle font-size="x-small" font-names="宋体" wrap="false" borderstyle="dashed" backcolor="#cccccc"></dayheaderstyle>
<selecteddaystyle font-bold="true" forecolor="white" backcolor="#666666"></selecteddaystyle>
<titlestyle font-size="small" font-bold="true" borderstyle="solid" bordercolor="black" backcolor="#999999"></titlestyle>
<weekenddaystyle backcolor="lightsteelblue"></weekenddaystyle>
<othermonthdaystyle forecolor="gray"></othermonthdaystyle>
</asp:calendar>
</asp:panel>
ctlcalendar.ascx.cs的源代码:
namespace calendar
{
using system;
using system.data;
using system.drawing;
using system.web;
using system.web.ui.webcontrols;
using system.web.ui.htmlcontrols;
/// <summary>
/// ctlcalendar 的摘要说明。
/// </summary>
public class ctlcalendar : system.web.ui.usercontrol
{
protected system.web.ui.webcontrols.textbox textbox1;
protected system.web.ui.webcontrols.panel pnlcalendar;
protected system.web.ui.htmlcontrols.htmlinputbutton button1;
protected system.web.ui.webcontrols.calendar calendar1;
private void page_load(object sender, system.eventargs e)
{
// 在此处放置用户代码以初始化页面
if (!page.ispostback)
{
this.textbox1.text = system.datetime.now.toshortdatestring();
this.pnlcalendar.attributes.add("style","display: none; position: absolute");
}
else
{
string id = page.request.form["__eventtarget"].substring(0,page.request.form["__eventtarget"].indexof(":"));
if (id != this.id)
{
this.pnlcalendar.attributes.add("style","display: none; position: absolute");
}
else
{
this.pnlcalendar.attributes.add("style","position: absolute");
}
}
page.registerclientscriptblock("script_panel" + this.id,
"<script> function on"+this.id+"click() { if("+this.id+
"_pnlcalendar.style.display == "none") "+this.id+
"_pnlcalendar.style.display = ""; else "+this.id+
"_pnlcalendar.style.display = "none"; } </script>");
this.button1.attributes.add("onclick","on"+this.id+"click()");
}
#region web 窗体设计器生成的代码
override protected void oninit(eventargs e)
{
//
// codegen: 该调用是 asp.net web 窗体设计器所必需的。
//
initializecomponent();
base.oninit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器
/// 修改此方法的内容。
/// </summary>
private void initializecomponent()
{
this.calendar1.selectionchanged += new system.eventhandler(this.calendar1_selectionchanged);
this.load += new system.eventhandler(this.page_load);
}
#endregion
#region 日历选择时的事件
private void calendar1_selectionchanged(object sender, system.eventargs e)
{
this.textbox1.text = calendar1.selecteddate.toshortdatestring();
this.pnlcalendar.attributes.add("style","display: none; position: absolute");
}
#endregion
}
}
复制代码 代码如下:
<%@ control language="c#" autoeventwireup="false" codebehind="ctlcalendar.ascx.cs" inherits="calendar.ctlcalendar" targetschema="http://schemas.microsoft.com/intellisense/ie5" enableviewstate="true"%>
<asp:textbox id="textbox1" runat="server"></asp:textbox>
<input type="button" id="button1" runat="server" value="..."><br>
<asp:panel id="pnlcalendar" runat="server" style="position: absolute">
<asp:calendar id="calendar1" runat="server" firstdayofweek="monday" showgridlines="true" backcolor="white"
daynameformat="full" forecolor="black" font-size="8pt" font-names="verdana" bordercolor="#999999"
cellpadding="4" width="200px" height="180px">
<todaydaystyle forecolor="black" backcolor="#cccccc"></todaydaystyle>
<selectorstyle backcolor="#cccccc"></selectorstyle>
<daystyle wrap="false" borderstyle="dashed"></daystyle>
<nextprevstyle verticalalign="bottom"></nextprevstyle>
<dayheaderstyle font-size="x-small" font-names="宋体" wrap="false" borderstyle="dashed" backcolor="#cccccc"></dayheaderstyle>
<selecteddaystyle font-bold="true" forecolor="white" backcolor="#666666"></selecteddaystyle>
<titlestyle font-size="small" font-bold="true" borderstyle="solid" bordercolor="black" backcolor="#999999"></titlestyle>
<weekenddaystyle backcolor="lightsteelblue"></weekenddaystyle>
<othermonthdaystyle forecolor="gray"></othermonthdaystyle>
</asp:calendar>
</asp:panel>
ctlcalendar.ascx.cs的源代码:
复制代码 代码如下:
namespace calendar
{
using system;
using system.data;
using system.drawing;
using system.web;
using system.web.ui.webcontrols;
using system.web.ui.htmlcontrols;
/// <summary>
/// ctlcalendar 的摘要说明。
/// </summary>
public class ctlcalendar : system.web.ui.usercontrol
{
protected system.web.ui.webcontrols.textbox textbox1;
protected system.web.ui.webcontrols.panel pnlcalendar;
protected system.web.ui.htmlcontrols.htmlinputbutton button1;
protected system.web.ui.webcontrols.calendar calendar1;
private void page_load(object sender, system.eventargs e)
{
// 在此处放置用户代码以初始化页面
if (!page.ispostback)
{
this.textbox1.text = system.datetime.now.toshortdatestring();
this.pnlcalendar.attributes.add("style","display: none; position: absolute");
}
else
{
string id = page.request.form["__eventtarget"].substring(0,page.request.form["__eventtarget"].indexof(":"));
if (id != this.id)
{
this.pnlcalendar.attributes.add("style","display: none; position: absolute");
}
else
{
this.pnlcalendar.attributes.add("style","position: absolute");
}
}
page.registerclientscriptblock("script_panel" + this.id,
"<script> function on"+this.id+"click() { if("+this.id+
"_pnlcalendar.style.display == "none") "+this.id+
"_pnlcalendar.style.display = ""; else "+this.id+
"_pnlcalendar.style.display = "none"; } </script>");
this.button1.attributes.add("onclick","on"+this.id+"click()");
}
#region web 窗体设计器生成的代码
override protected void oninit(eventargs e)
{
//
// codegen: 该调用是 asp.net web 窗体设计器所必需的。
//
initializecomponent();
base.oninit(e);
}
/// <summary>
/// 设计器支持所需的方法 - 不要使用代码编辑器
/// 修改此方法的内容。
/// </summary>
private void initializecomponent()
{
this.calendar1.selectionchanged += new system.eventhandler(this.calendar1_selectionchanged);
this.load += new system.eventhandler(this.page_load);
}
#endregion
#region 日历选择时的事件
private void calendar1_selectionchanged(object sender, system.eventargs e)
{
this.textbox1.text = calendar1.selecteddate.toshortdatestring();
this.pnlcalendar.attributes.add("style","display: none; position: absolute");
}
#endregion
}
}