ASP.NET初学笔记:Calendar控件

最新推荐文章于 2025-06-10 15:10:48 发布

wangliang262359

最新推荐文章于 2025-06-10 15:10:48 发布

阅读量1.5k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： ASP.NET学习笔记文章标签： calendar asp.net server asp textbox xhtml

版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文链接：https://blog.youkuaiyun.com/wangliang262359/article/details/5934149

本文介绍了ASP.NET的Calendar控件的使用，包括选择多个日期、创建弹出式日期选择器以及根据数据库表呈现日历的功能。示例代码展示了如何绑定事件、设置选择模式以及与数据库交互以显示和管理日程条目。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Calendar控件用来显示日历，可以把日历当作日期选择器来使用或用来显示预定事件列表。

1. 选择多个日期

Calendar控件SelectionMode属性可以改变Calendar的行为，使你不仅可以选择日，也可以选择周或月。下面代码演示如何联合SelectionMode和SelectedDates属性来选择多个日期。
<%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> protected void btn_Click(object sender, EventArgs e) { BulletedList1.DataSource = Calendar1.SelectedDates; BulletedList1.DataBind(); } </script> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title>无标题页</title> </head> <body> <form id="form1" runat="server"> <div> <asp:Calendar ID="Calendar1" runat="server" SelectionMode="DayWeekMonth"></asp:Calendar><br /> <asp:Button ID="btn" runat="server" Text="Submit" OnClick="btn_Click" /><hr /> <asp:BulletedList ID="BulletedList1" runat="server" DataTextFormatString="{0:d}"> </asp:BulletedList>  </div> </form> </body> </html> 效果：

2. 创建弹出式日期选择器

很简单，看代码和效果：<%@ Page Language="C#" %> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <script runat="server"> protected void calEventDate_SelectionChanged(object sender, EventArgs e) { txtEventDate.Text = calEventDate.SelectedDate.ToString("d"); } protected void btnSubmit_Click(object sender, EventArgs e) { lblResult.Text = "You picked: " + txtEventDate.Text; } </script> <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <script type="text/javascript"> function displayCalendar() { var datePicker=document.getElementById('datePicker'); datePicker.style.display='block'; } </script> <style type="text/css"> #datePicker { display:none; position:absolute; border:solid 2px black; background:white; } </style> <title>无标题页</title> </head> <body> <form id="form1" runat="server"> <div> <as

最低0.47元/天解锁文章

200万优质内容无限畅学

评论 1

被折叠的条评论为什么被折叠?

到【灌水乐园】发言

查看更多评论

添加红包

成就一亿技术人!

hope_wisdom

发出的红包

实付元

使用余额支付

点击重新获取

扫码支付

钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。