Share via

Calendar Class

  • Article

Provides control capability to display a calendar.

public class System.Web.UI.MobileControls.Calendar :
   System.Web.UI.MobileControls.MobileControl,
   System.Web.UI.IPostBackEventHandler

Remarks

The calendar display is by day, week, or month. Whether an entire month is rendered on a mobile device depends on the capabilities of the device. In general, the Calendar control permits the selection of a date.

The mobile Calendar control wraps a Web Forms Calendar control. Although the mobile Calendar control mimics some properties, methods, and events of the underlying control, it does not expose other properties specific to HTML rendering. To modify these, you can access the underlying control through the WebCalendar property and modify the settings directly.

Example

The following code example shows how the SelectionMode property in the page load code block allows the user to select a day, a week, or a month block of time. This example sets the BorderStyle and Backcolor properties of the Calendar class to distinguish the user selection.

<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage" 
   Language="VB" %>
<%@ Register TagPrefix="mobile"
    Namespace="System.Web.UI.MobileControls"
    Assembly="System.Web.Mobile" %>

<%@ Import NameSpace="System.Drawing" %>

<script language="vb" runat=server>

Protected Sub Page_Load(sender As Object, e As EventArgs)
   ' Display the day header if desired.
   Calendar1.ShowDayHeader = true

   ' This allows the user to select a week or a month at a time.
   Calendar1.SelectionMode = _
      CalendarSelectionMode.DayWeekMonth

   ' Set the BorderStyle and BorderColor properties.
   Calendar1.WebCalendar.DayStyle.BorderStyle = _
      BorderStyle.Solid
   Calendar1.WebCalendar.DayStyle.BorderColor = Color.Cyan
End Sub

Protected Sub ShowChanges(sender As Object, e As EventArgs)
   TextView1.Text = "The date you selected is " + _
      Calendar1.SelectedDate.ToShortDateString()

   ' Distinguish the selected block using colors.
   Calendar1.WebCalendar.SelectedDayStyle.BackColor = _ 
      Color.LightGreen
   Calendar1.WebCalendar.SelectedDayStyle.BorderColor = _ 
      Color.Gray
   Calendar1.WebCalendar.DayStyle.BorderColor = Color.Blue
End Sub

</script>
<mobile:Form id="Form1" runat=server>
<mobile:Calendar id="Calendar1" runat="server"
   OnSelectionChanged="ShowChanges" />
<mobile:TextView runat="server" id="TextView1" />
</mobile:Form>
[C#]
<%@ Page Inherits="System.Web.UI.MobileControls.MobilePage" 
   Language="c#" %>
<%@ Register TagPrefix="mobile"
    Namespace="System.Web.UI.MobileControls"
    Assembly="System.Web.Mobile" %>

<%@ Import NameSpace="System.Drawing" %>

<script language="c#" runat=server>

protected void Page_Load(Object sender, EventArgs e)
{
   // Display the day header if desired.
   Calendar1.ShowDayHeader = true;

   // This allows the user to select a week or a month at a time.
   Calendar1.SelectionMode = 
      CalendarSelectionMode.DayWeekMonth;

   // Set the BorderStyle and BorderColor properties.
   Calendar1.WebCalendar.DayStyle.BorderStyle = 
      BorderStyle.Solid;
   Calendar1.WebCalendar.DayStyle.BorderColor = Color.Cyan;
}

protected void ShowChanges(Object sender, EventArgs e)
{
   TextView1.Text = "The date you selected is " + 
      Calendar1.SelectedDate.ToShortDateString();

   // Distinguish the selected block using colors.
   Calendar1.WebCalendar.SelectedDayStyle.BackColor = 
      Color.LightGreen;
   Calendar1.WebCalendar.SelectedDayStyle.BorderColor = 
      Color.Gray;
   Calendar1.WebCalendar.DayStyle.BorderColor = Color.Blue;
}

</script>
<mobile:Form id="Form1" runat=server>
<mobile:Calendar id="Calendar1" runat="server"
   OnSelectionChanged="ShowChanges" />
<mobile:TextView runat="server" id="TextView1" />
</mobile:Form>

Requirements

Namespace: System.Web.UI.MobileControls

Assembly: System.Web.Mobile

See Also

Calendar Control