扩展CalendarExtender的应用场合（改进版）
在上周的扩展CalendarExtender的应用场合一文中提出了扩展的目的，GaryW提出“把ClientID当成一个变量传入JavaScript函数”的思路来简化扩展的解决方案，但又会遇到两个问题：
问题1：OnClientDateSelectionChanged属性只能设置不带参数的JavaScript函数名。
问题2：按目前的方案，页面上有多个用户控件的时候，相同格式的JavaScript函数的确会生成多次，显得很繁琐，但按新提出的方案，势必会造成这些JavaScript函数重名。
为此，今天对AdvancedCalendarExtender做了些改进，生成的JavaScript更简洁，但需要自己手工在每次调用用户控件的页面中拷贝JavaScript函数。鱼和熊掌真是很难兼得，看是想要用得方便（灵活性），还是客户端代码更简洁（性能）。下面给出完整代码：
<asp:TextBox ID="txtYear" runat="server" Width="35px" MaxLength="4"></asp:TextBox> /
<asp:TextBox ID="txtMonth" runat="server" Width="20px" MaxLength="2"></asp:TextBox> /
<asp:TextBox ID="txtDay" runat="server" Width="20px" MaxLength="2"></asp:TextBox>
<asp:ImageButton ID="btnSelector" runat="server" ImageUrl="~/images/icon_calendar.gif" />
<ajax:CalendarExtender ID="calExt" runat="server" Format="yyyy/MM/dd" PopupButtonID="btnSelector" TargetControlID="txtYear"></ajax:CalendarExtender>
AdvancedCalendarExtender.ascx
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class AdvancedCalendarExtender : System.Web.UI.UserControl
{
protected void Page_Load(object sender, EventArgs e)
{
ScriptManager.RegisterClientScriptBlock(this, this.GetType(), ClientID, @"function " + ClientID + "() { select('" + ClientID + "'); } ", true);
calExt.OnClientDateSelectionChanged = ClientID;
}
public string Year
{
get { return txtYear.Text; }
set { txtYear.Text = value; }
}
public string Month
{
get { return txtMonth.Text; }
set { txtMonth.Text = value; }
}
public string Day
{
get { return txtDay.Text; }
set { txtDay.Text = value; }
}
}
AdvancedCalendarExtender.ascx.cs
<%@ Register src="AdvancedCalendarExtender.ascx" tagname="AdvancedCalendarExtender" tagprefix="mine" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Advanced CalendarExtender</title>
<script language="javascript" type="text/javascript">
function select(clientId) {
var date = $get(clientId + "_txtYear").value;
date = date.split("/");
$get(clientId + "_txtYear").value = date[0];
$get(clientId + "_txtMonth").value = date[1];
$get(clientId + "_txtDay").value = date[2];
}
</script>
</head>
<body>
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<p>From: <mine:AdvancedCalendarExtender ID="aceFromDate" runat="server" /></p>
<p>To: <mine:AdvancedCalendarExtender ID="aceToDate" runat="server" /></p>
<p><asp:Button ID="btnSubmit" runat="server" Text="Submit" onclick="btnSubmit_Click" /></p>
<p><asp:Label ID="lblResult" runat="server"></asp:Label></p>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
Default.aspx
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
public partial class _Default: System.Web.UI.Page
{
protected void btnSubmit_Click(object sender, EventArgs e)
{
lblResult.Text = string.Format("Your selection is from {0}-{1}-{2} to {3}-{4}-{5}.", aceFromDate.Year, aceFromDate.Month, aceFromDate.Day, aceToDate.Year, aceToDate.Month, aceToDate.Day);
}
}
Default.aspx.cs
Enjoy!
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语，封装的思维：从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热？
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列：向量存储与相似性搜索在 .NET 中的实现
· 周边上新：园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源！
· 分享 3 个 .NET 开源的文件压缩处理库，助力快速实现文件压缩解压功能！
· Ollama——大语言模型本地部署的极速利器
· [AI/GPT/综述] AI Agent的设计模式综述