Introduction
Web Forms are web pages made on ASP.NET Technology. It executes on the server, produces output to the browser, and is compatible with all the browsers and languages supported by the .Net language runtime. It allows us to create and add custom controls.
Web Form Calendar is used to display the dates in a calendar. It also displays data associated with a specific date. It control displays a calendar through which users can move to any day in any year. We can also set the Selected Date property that displays a specified date in the calendar.
Let’s now learn how to create a calendar.
Creating a Calendar
The calendar control is a web control that provides the following capabilities:-
1.) Displays one month at a time.
2.) Select a day, a week, or a month.
3.) Select a range of days.
4.) Control the display of the days programmatically.
5.) Move from month to month.
To create a Calendar, we can drag it from the toolbox of the Visual Studio.
Calendars are handled on the server-side control, and ASP.NET provides its tag to create it. The example is given below.
<asp:CalendarID="Calendar1" runat="server" SelectedDate="2022-02-04" ></asp:Calendar>
The server will render it as HTML control and give the following code to the browser.
<table id="Calendar1" cellspacing="0" cellpadding="2" title="Calendar"
style="border-width:1px;border-style:solid;border-collapse:collapse;">
<tr><td colspan="7" style="background-color:Silver;">
<table cellspacing="0" style="width:100%;border-collapse:collapse;">
<tr><td style="width:15%;">
<a href="javascript:__doPostBack('Calendar1','V6330')"
style="color:Black" title="Go to the previous month"></a> ...
Control has its properties that are tabled below.
Now, we are implementing a calendar and displaying user-selected dates on the web page.
In WebControls.aspx file:
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebControls.aspx.cs"
Inherits="WebFormsControlls.WebControls" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<h2>Select Date from the Calendar</h2>
<div>
<asp:Calendar ID="Calendar1" runat="server"
OnSelectionChanged="Calendar1_SelectionChanged"></asp:Calendar>
</div>
</form>
<p>
<asp:Label runat="server" ID="ShowDate" ></asp:Label>
</p>
</body>
</html>
The code behind the above HTML is present in the following file.
In WebControls.aspx.cs file:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
namespace WebFormsControlls
{
public partial class WebControls : System.Web.UI.Page
{
public void Calendar1_SelectionChanged(object sender, EventArgs e)
{
ShowDate.Text = "You Selected: "+Calendar1.SelectedDate.ToString("D");
}
}
}