程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> ASP.NET >> ASP.NET基礎 >> ASP.NET Calendar日歷(日期)控件使用方法

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

編輯:ASP.NET基礎

Calendar 控件顯示一個日歷,用戶可通過該日歷導航到任意一年的任意一天。當 ASP.NET 網頁運行時,Calendar 控件以 HTML 表格的形式呈現。因此,該控件的許多屬性與多種不同的表格格式相符。在這些屬性中,有幾個在一些低版本的浏覽器中不能得到完全支持,因此在這些浏覽器中並不能使用所有的格式功能。

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

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

默認情況下,該控件顯示月中各天、周中各天的標頭、帶有月份名和年份的標題、用於選擇月份中各天的鏈接及用於移動到下個月和上個月的鏈接。您可以通過設置控制控件中不同部分的樣式的屬性,來自定義 Calendar 控件的外觀。下表列出了指定控件不同部分的樣式的屬性。

屬性 說明

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

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

ShowDayHeader 顯示或隱藏顯示一周中各天的部分。 ShowGridLines 顯示或隱藏月中各天之間的網格線。 ShowNextPrevMonth 顯示或隱藏指向下個月或上個月的導航控件。 ShowTitle 顯示或隱藏標題部分。

盡管 Calendar 控件不支持綁定到數據源,但是可以修改各個日期單元格的內容和格式設置。在網頁上顯示 Calendar 控件之前,它創建並匯編組成該控件的組件。當創建 Calendar 控件中的每個日期單元格時,均會引發 DayRender 事件。通過在 DayRender 事件的事件處理程序中提供代碼,可以在創建日期單元格時控制其內容和格式設置。

Calendar 控件將 ECMAScript(JScript、JavaScript)呈現給客戶端浏覽器。客戶端浏覽器必須啟用 ECMAScript,此控件才能正常工作。

下面的代碼示例演示如何在網頁上創建 Calendar 控件。

前台代碼:

<%@ 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">
      
     屬性</td>
    <td>
     值</td>
    <td>
     作用</td>
   </tr>
  </table>
  <hr />
  請選擇日期:<asp:Calendar ID="calDate" runat="server"></asp:Calendar>
  <asp:Button ID="btnSubmit" runat="server" Text="提交" onclick="btnSubmit_Click" />
  <hr />
  請選的日期為:<asp:Label ID="lblState" runat="server"></asp:Label>
  <br />
  <br />
  本地日期和時間為:<asp:Label ID="lblBenDiShiJian" runat="server"></asp:Label>
 </div>
 </form>
</body>
</html>

後台代碼:

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日歷控件

請選的日期為:2013-03-13

本地日期和時間為:2013-03-06 10:22:23

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved