ASP.NET Calendar日歷(日期)控件使用方法

更新時(shí)間：2016年04月15日 10:32:53 作者：superfang

本文主要介紹Calendar日歷控件的各個(gè)屬性以及舉例演示Calendar控件的具體使用方法，希望對(duì)大家有所幫助。

Calendar 控件顯示一個(gè)日歷，用戶可通過該日歷導(dǎo)航到任意一年的任意一天。當(dāng) ASP.NET 網(wǎng)頁運(yùn)行時(shí)，Calendar 控件以 HTML 表格的形式呈現(xiàn)。因此，該控件的許多屬性與多種不同的表格格式相符。在這些屬性中，有幾個(gè)在一些低版本的瀏覽器中不能得到完全支持，因此在這些瀏覽器中并不能使用所有的格式功能。

使用 Calendar 控件在網(wǎng)頁上顯示日歷的單個(gè)月。該控件使您可以選擇日期并移到下個(gè)月或上個(gè)月。Calendar 控件支持 System.Globalization 命名空間中的所有 System.Globalization.Calendar 類型。除公歷以外，這還包括使用不同年和月系統(tǒng)的日歷，如 Hjiri 日歷。

可以通過設(shè)置 SelectionMode 屬性指定 Calendar 控件是否允許選擇單日、周或整月。

默認(rèn)情況下，該控件顯示月中各天、周中各天的標(biāo)頭、帶有月份名和年份的標(biāo)題、用于選擇月份中各天的鏈接及用于移動(dòng)到下個(gè)月和上個(gè)月的鏈接。您可以通過設(shè)置控制控件中不同部分的樣式的屬性，來自定義 Calendar 控件的外觀。下表列出了指定控件不同部分的樣式的屬性。

屬性說明

DayHeaderStyle	為顯示一周中各天的部分指定樣式。
DayStyle	為顯示的月份中的日期指定樣式。
NextPrevStyle	為標(biāo)題部分中的導(dǎo)航控件指定樣式。
OtherMonthDayStyle	為不在當(dāng)前顯示的月份中的日期指定樣式。
SelectedDayStyle	為日歷中的選定日期指定樣式。
SelectorStyle	為周和月份日期選擇列指定樣式。
TitleStyle	為標(biāo)題部分指定樣式。
TodayDayStyle	為今天日期指定樣式。
WeekendDayStyle	為周末日期指定樣式。

也可以顯示或隱藏控件的不同部分。下表列出控制顯示或隱藏哪些部分的屬性。

ShowDayHeader	顯示或隱藏顯示一周中各天的部分。
ShowGridLines	顯示或隱藏月中各天之間的網(wǎng)格線。
ShowNextPrevMonth	顯示或隱藏指向下個(gè)月或上個(gè)月的導(dǎo)航控件。
ShowTitle	顯示或隱藏標(biāo)題部分。

盡管 Calendar 控件不支持綁定到數(shù)據(jù)源，但是可以修改各個(gè)日期單元格的內(nèi)容和格式設(shè)置。在網(wǎng)頁上顯示 Calendar 控件之前，它創(chuàng)建并匯編組成該控件的組件。當(dāng)創(chuàng)建 Calendar 控件中的每個(gè)日期單元格時(shí)，均會(huì)引發(fā) DayRender 事件。通過在 DayRender 事件的事件處理程序中提供代碼，可以在創(chuàng)建日期單元格時(shí)控制其內(nèi)容和格式設(shè)置。

Calendar 控件將 ECMAScript（JScript、JavaScript）呈現(xiàn)給客戶端瀏覽器?？蛻舳藶g覽器必須啟用 ECMAScript，此控件才能正常工作。

下面的代碼示例演示如何在網(wǎng)頁上創(chuàng)建 Calendar 控件。

前臺(tái)代碼：

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Calendar.aspx.cs" Inherits="WebControls_Calendar" %>

<!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></title>
 <style type="text/css">
  .style1
  {
   width: 369px;
  }
 </style>
</head>
<body>
 <form id="form1" runat="server">
 <div>
 <h3>Calendar(日期控件)</h3>
  <table style="width: 100%;">
   <tr>
    <td class="style1">
     &nbsp;
     屬性</td>
    <td>
     值</td>
    <td>
     作用</td>
   </tr>
  </table>
  <hr />
  請(qǐng)選擇日期：<asp:Calendar ID="calDate" runat="server"></asp:Calendar>
  <asp:Button ID="btnSubmit" runat="server" Text="提交" onclick="btnSubmit_Click" />
  <hr />
  請(qǐng)選的日期為：<asp:Label ID="lblState" runat="server"></asp:Label>
  <br />
  <br />
  本地日期和時(shí)間為：<asp:Label ID="lblBenDiShiJian" runat="server"></asp:Label>
 </div>
 </form>
</body>
</html>

后臺(tái)代碼：

using System;
using System.Collections.Generic;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class WebControls_Calendar : System.Web.UI.Page
{
 protected void Page_Load(object sender, EventArgs e)
 {
  lblBenDiShiJian.Text = System.DateTime.Now.ToString();
 }
 protected void btnSubmit_Click(object sender, EventArgs e)
 {
  lblState.Text = calDate.SelectedDate.ToShortDateString();
 }
}

顯示效果：

Calendar日歷控件