ASP日历控件是ASP.NET中常用的服务器控件,主要用于在Web页面中显示日历界面,并允许用户选择日期、浏览月份等操作,它提供了丰富的属性和事件,方便开发者快速实现日期选择、日程展示等功能,下面将从基本用法、常用属性、事件处理、实际应用场景等方面详细介绍其使用方法。

添加日历控件到页面
在ASP.NET页面中,直接通过<asp:Calendar>标签即可添加日历控件,在.aspx页面中写入以下代码:
<asp:Calendar ID="Calendar1" runat="server" OnSelectionChanged="Calendar1_SelectionChanged"></asp:Calendar>
ID属性用于唯一标识控件,runat="server"表示为服务器端控件,OnSelectionChanged是事件属性,用于绑定选中日期改变时的处理方法。
常用属性及设置
日历控件的属性较多,主要用于控制其外观、行为和日期选择模式,以下为常用属性的说明及示例:
| 属性名 | 说明 | 示例 |
|---|---|---|
SelectedDate |
获取或设置选中的单个日期(DateTime类型) | Calendar1.SelectedDate = DateTime.Today; |
SelectedDates |
获取选中的多个日期(SelectedDatesCollection类型) | foreach (DateTime date in Calendar1.SelectedDates) { ... } |
VisibleDate |
获取或设置当前显示的月份(DateTime类型,只取年月部分) | Calendar1.VisibleDate = new DateTime(2023, 10, 1); |
SelectionMode |
设置日期选择模式(Day/Week/Month),默认为Day | Calendar1.SelectionMode = CalendarSelectionMode.Week; |
DayStyle |
设置日期单元格的样式(如背景色、字体等) | Calendar1.DayStyle.BackColor = LightGray; |
SelectedDayStyle |
设置选中日期的样式 | Calendar1.SelectedDayStyle.BackColor = Red; |
ShowDayHeader |
是否显示星期表头(如“日、一、二、…、六”),默认为True | Calendar1.ShowDayHeader = false; |
ShowGridLines |
是否显示单元格网格线,默认为False | Calendar1.ShowGridLines = true; |
NextPrevFormat |
设置上月/下月按钮的显示方式(Text或Image),默认为Text | Calendar1.NextPrevFormat = CalendarNextPrevFormat.Text; |
FirstDayOfWeek |
设置每周的第一天(如Sunday、Monday),默认为Sunday | Calendar1.FirstDayOfWeek = FirstDayOfWeek.Monday; |
事件处理
日历控件的事件是其交互功能的核心,常用事件如下:
SelectionChanged事件
当选中日期改变时触发(如点击某一天),通常用于获取选中的日期并执行后续操作,例如将日期显示在文本框中或查询数据。
后台代码示例:

protected void Calendar1_SelectionChanged(object sender, EventArgs e)
{
TextBox1.Text = Calendar1.SelectedDate.ToString("yyyy-MM-dd"); // 将选中日期格式化后显示在文本框
}
DayRender事件
在渲染每一天的单元格时触发,允许自定义单元格内容或样式(如标记特定日期、添加文字等)。
后台代码示例:
protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
{
// 如果日期是2023-10-15,添加特殊样式和文字
if (e.Day.Date == new DateTime(2023, 10, 15))
{
e.Cell.BackColor = Yellow;
e.Cell.Controls.Add(new LiteralControl("<br>会议"));
}
// 禁用过去的日期
if (e.Day.Date < DateTime.Today)
{
e.Day.IsSelectable = false;
e.Cell.ForeColor = Gray;
}
}
VisibleMonthChanged事件
当切换月份(点击“上月”或“下月”按钮)时触发,可用于动态加载月份相关数据(如某月的日程安排)。
后台代码示例:
protected void Calendar1_VisibleMonthChanged(object sender, MonthChangedEventArgs e)
{
Label1.Text = $"当前显示:{e.NewDate.Year}年{e.NewDate.Month}月";
}
实际应用场景
日期选择器
结合文本框使用,用户通过日历选择日期后,自动将日期填充到文本框中,在注册页面中选择出生日期。
日程标记
使用DayRender事件,在特定日期添加标记(如“假期”“会议”),或通过数据库查询某天的日程并显示在单元格中。
日期范围选择
通过两个日历控件分别选择开始日期和结束日期,结合SelectionMode="Week"或SelectionMode="Month"实现周/月范围选择,常用于报表筛选或日期范围查询。

注意事项
- 性能优化:若日历需展示大量自定义数据(如每日日程),建议在
DayRender事件中减少重复计算,避免影响页面加载速度。 - 样式兼容性:不同浏览器对CSS样式的解析可能存在差异,建议使用
Calendar控件的内置样式属性(如DayStyle、TitleStyle)或内联样式,减少外部CSS依赖。 - 日期格式化:通过
SelectedDate.ToString()格式化日期时,需注意服务器端与客户端的时区差异,确保显示正确。
相关问答FAQs
问题1:如何禁用Calendar控件中的某些特定日期(如周末或节假日)?
解答:通过DayRender事件判断日期是否需要禁用,并设置e.Day.IsSelectable = false,禁用所有周末:
protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
{
if (e.Day.Date.DayOfWeek == DayOfWeek.Saturday || e.Day.Date.DayOfWeek == DayOfWeek.Sunday)
{
e.Day.IsSelectable = false;
e.Cell.ForeColor = Gray;
}
}
问题2:如何将Calendar控件选中的日期保存到数据库?
解答:在SelectionChanged事件中获取选中日期,结合ADO.NET或Entity Framework执行插入操作,使用SQL Server:
protected void Calendar1_SelectionChanged(object sender, EventArgs e)
{
DateTime selectedDate = Calendar1.SelectedDate;
string connectionString = "YourConnectionString";
string query = "INSERT INTO Schedule (Date) VALUES (@Date)";
using (SqlConnection conn = new SqlConnection(connectionString))
{
SqlCommand cmd = new SqlCommand(query, conn);
cmd.Parameters.AddWithValue("@Date", selectedDate);
conn.Open();
cmd.ExecuteNonQuery();
}
}
【版权声明】:本站所有内容均来自网络,若无意侵犯到您的权利,请及时与我们联系将尽快删除相关内容!