ASP.NET - 日曆控制元件

日曆控制元件是一個功能豐富的 Web 控制元件，它提供以下功能：

一次顯示一個月
選擇一天、一週或一個月
選擇一個日期範圍
在月份之間切換
以程式設計方式控制日期的顯示

日曆控制元件的基本語法是：

<asp:Calender ID = "Calendar1" runat = "server">
</asp:Calender>

日曆控制元件的屬性和事件

日曆控制元件具有許多屬性和事件，您可以使用它們來自定義控制元件的操作和顯示。下表提供了一些日曆控制元件的重要屬性：

屬性	描述
Caption	獲取或設定日曆控制元件的標題。
CaptionAlign	獲取或設定標題的對齊方式。
CellPadding	獲取或設定資料和單元格邊框之間的空格數。
CellSpacing	獲取或設定單元格之間的間距。
DayHeaderStyle	獲取顯示星期幾部分的樣式屬性。
DayNameFormat	獲取或設定星期的格式。
DayStyle	獲取顯示月份中日期的樣式屬性。
FirstDayOfWeek	獲取或設定要顯示在第一列的星期幾。
NextMonthText	獲取或設定下一個月導航控制元件的文字。預設值為>。
NextPrevFormat	獲取或設定下一個月和上一個月的導航控制元件的格式。
OtherMonthDayStyle	獲取日曆控制元件中不在顯示月份中的日期的樣式屬性。
PrevMonthText	獲取或設定上一個月導航控制元件的文字。預設值為<。
SelectedDate	獲取或設定所選日期。
SelectedDates	獲取代表所選日期的 DateTime 物件集合。
SelectedDayStyle	獲取所選日期的樣式屬性。
SelectionMode	獲取或設定選擇模式，該模式指定使用者是否可以選擇單個日期、一週或整個月。
SelectMonthText	獲取或設定選擇器列中月份選擇元素的文字。
SelectorStyle	獲取星期和月份選擇器列的樣式屬性。
SelectWeekText	獲取或設定在選擇器列中顯示的星期選擇元素的文字。
ShowDayHeader	獲取或設定一個值，該值指示是否顯示星期的標題。
ShowGridLines	獲取或設定一個值，該值指示是否顯示網格線。
ShowNextPrevMonth	獲取或設定一個值，該值指示是否在標題部分顯示下一個月和上一個月的導航元素。
ShowTitle	獲取或設定一個值，該值指示是否顯示標題部分。
TitleFormat	獲取或設定標題部分的格式。
TitleStyle	獲取日曆控制元件標題的樣式屬性。
TodayDayStyle	獲取日曆控制元件中今天日期的樣式屬性。
TodayDate	獲取或設定今天日期的值。
UseAccessibleHeader	獲取或設定一個值，該值指示是否為日期標題呈現表格標題<th> HTML 元素，而不是表格資料<td> HTML 元素。
VisibleDate	獲取或設定指定要顯示月份的日期。
WeekendDayStyle	獲取日曆控制元件中週末日期的樣式屬性。

日曆控制元件具有以下三個最重要的事件，允許開發人員對日曆控制元件進行程式設計。它們是：

事件	描述
SelectionChanged	當選擇一天、一週或整個月時觸發。
DayRender	當渲染日曆控制元件的每個資料單元格時觸發。
VisibleMonthChanged	當用戶更改月份時觸發。

使用日曆控制元件

在沒有程式碼隱藏檔案的情況下放置一個簡單的日曆控制元件，可以為網站提供一個可用的日曆，顯示一年中的月份和日期。它還允許導航到下一個月和上一個月。

日曆控制元件允許使用者選擇單個日期、一週或整個月。這是透過使用 SelectionMode 屬性完成的。此屬性具有以下值：

屬性	描述
Day	選擇單個日期。
DayWeek	選擇單個日期或整個星期。
DayWeekMonth	選擇單個日期、一週或整個月。
None	什麼也無法選擇。

選擇日期的語法：

<asp:Calender ID = "Calendar1" runat = "server" SelectionMode="DayWeekMonth">
</asp:Calender>

當選擇模式設定為 DayWeekMonth 值時，會顯示一個帶有 > 符號的額外列，用於選擇星期，並且在日期名稱左側顯示一個 >> 符號，用於選擇月份。

示例

以下示例演示如何選擇日期並在標籤中顯示日期

內容檔案程式碼如下：

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="calendardemo._Default" %>

<!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>
         Untitled Page
      </title>
   </head>
   
   <body>
      <form id="form1" runat="server">
      
         <div>
            <h3> Your Birthday:</h3>
            <asp:Calendar ID="Calendar1" runat="server  SelectionMode="DayWeekMonth" onselectionchanged="Calendar1_SelectionChanged">
            </asp:Calendar>
         </div>
         
         <p>Todays date is: 
            <asp:Label ID="lblday" runat="server"></asp:Label>
         </p>
         
         <p>Your Birday is: 
            <asp:Label ID="lblbday" runat="server"></asp:Label>
         </p>
         
      </form>
   </body>
</html>

SelectionChanged 事件的事件處理程式：

protected void Calendar1_SelectionChanged(object sender, EventArgs e)
{
   lblday.Text = Calendar1.TodaysDate.ToShortDateString();
   lblbday.Text = Calendar1.SelectedDate.ToShortDateString();
}

執行檔案後，應產生以下輸出：

列印頁面