ASP.NET-カレンダー

カレンダーコントロールは、機能が豊富なWebコントロールであり、次の機能を提供します。

一度に1か月表示
日、週、または月の選択
日の範囲を選択する
月から月への移動
プログラムで日の表示を制御する

カレンダーコントロールの基本的な構文は次のとおりです。

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

カレンダーコントロールのプロパティとイベント

カレンダーコントロールには多くのプロパティとイベントがあり、これらを使用してコントロールのアクションと表示をカスタマイズできます。次の表に、Calendarコントロールの重要なプロパティをいくつか示します。

Properties	Description
Caption	Gets or sets the caption for the calendar control.
CaptionAlign	Gets or sets the alignment for the caption.
CellPadding	Gets or sets the number of spaces between the data and the cell border.
CellSpacing	Gets or sets the space between cells.
DayHeaderStyle	Gets the style properties for the section that displays the day of the week.
DayNameFormat	Gets or sets format of days of the week.
DayStyle	Gets the style properties for the days in the displayed month.
FirstDayOfWeek	Gets or sets the day of week to display in the first column.
NextMonthText	Gets or sets the text for next month navigation control. The default value is >.
NextPrevFormat	Gets or sets the format of the next and previous month navigation control.
OtherMonthDayStyle	Gets the style properties for the days on the Calendar control that are not in the displayed month.
PrevMonthText	Gets or sets the text for previous month navigation control. The default value is <.
SelectedDate	Gets or sets the selected date.
SelectedDates	Gets a collection of DateTime objects representing the selected dates.
SelectedDayStyle	Gets the style properties for the selected dates.
SelectionMode	Gets or sets the selection mode that specifies whether the user can select a single day, a week or an entire month.
SelectMonthText	Gets or sets the text for the month selection element in the selector column.
SelectorStyle	Gets the style properties for the week and month selector column.
SelectWeekText	Gets or sets the text displayed for the week selection element in the selector column.
ShowDayHeader	Gets or sets the value indicating whether the heading for the days of the week is displayed.
ShowGridLines	Gets or sets the value indicating whether the gridlines would be shown.
ShowNextPrevMonth	Gets or sets a value indicating whether next and previous month navigation elements are shown in the title section.
ShowTitle	Gets or sets a value indicating whether the title section is displayed.
TitleFormat	Gets or sets the format for the title section.
Titlestyle	Get the style properties of the title heading for the Calendar control.
TodayDayStyle	Gets the style properties for today’s date on the Calendar control.
TodaysDate	Gets or sets the value for today’s date.
UseAccessibleHeader	Gets or sets a value that indicates whether to render the table header <th> HTML element for the day headers instead of the table data <td> HTML element.
VisibleDate	Gets or sets the date that specifies the month to display.
WeekendDayStyle	Gets the style properties for the weekend dates on the Calendar control.

カレンダーコントロールには、開発者がカレンダーコントロールをプログラムできる次の3つの最も重要なイベントがあります。彼らです：

Events	Description
SelectionChanged	It is raised when a day, a week or an entire month is selected.
DayRender	It is raised when each data cell of the calendar control is rendered.
VisibleMonthChanged	It is raised when user changes a month.

カレンダーコントロールの使用

コードビハインドファイルを使用せずにベアボーンカレンダーコントロールを配置すると、サイトに実行可能なカレンダーが提供され、年の月と日が表示されます。また、来月および前月へのナビゲーションが可能になります。

カレンダー

カレンダーコントロールを使用すると、ユーザーは1日、1週間、または1か月全体を選択できます。これは、SelectionModeプロパティを使用して行われます。このプロパティには次の値があります。

Properties	Description
Day	To select a single day.
DayWeek	To select a single day or an entire week.
DayWeekMonth	To select a single day, a week, or an entire month.
None	Nothing can be selected.

日を選択するための構文：

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

選択モードが値DayWeekMonthに設定されている場合、週を選択するための>記号が付いた追加の列が表示され、月を選択するために曜日名の左側に>>記号が表示されます。

Calendar2

例

次の例は、日付の選択を示し、ラベルに日付を表示します。

コンテンツファイルのコードは次のとおりです。

<%@ 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();
}

ファイルが実行されると、次の出力が生成されます。

Calendar3

Asp.net-calenders

ASP.NET-カレンダー

カレンダーコントロールのプロパティとイベント

カレンダーコントロールの使用

例

目次