Web Server Calendar Control in ASP.NET 2.0

The Calendar control is based on the .NET Framework DateTime object, and you can display any date between the years 0 and 9999 A.D.In the following article you will find that you can utilize the existing control as per you requirement.

In Visual Studio 2005 changing the template is quit easy as compare to MS VS 2003.You can see the templates below:

0.gif
 


1.gif

2.gif

3.gif

4.gif

5.gif

7.gif

After selecting the template for calender, editor will generate the following code for you:

<asp:Calendar ID="calSource" runat="server" BackColor="#FFFFCC" BorderColor="#FFCC66" BorderWidth="1px"  DayNameFormat="Shortest" Font-Names="Verdana" Font-Size="8pt" ForeColor="#663399" Height="200px" ShowGridLines="True" Width="220px" OnSelectionChanged="calSource_SelectionChanged">
            <SelectedDayStyle BackColor="#CCCCFF" Font-Bold="True" />
            <TodayDayStyle BackColor="#FFCC66" ForeColor="White" />
            <SelectorStyle BackColor="#FFCC66" />
            <OtherMonthDayStyle ForeColor="#CC9966" />
            <NextPrevStyle Font-Size="9pt" ForeColor="#FFFFCC" />
            <DayHeaderStyle BackColor="#FFCC66" Font-Bold="True" Height="1px" />
            <TitleStyle BackColor="#990000" Font-Bold="True" Font-Size="9pt" ForeColor="#FFFFCC" />
</asp:Calendar>

In the same way add other controls also

 

<asp:DropDownList ID="drpMonthCal" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drpCalMonth_SelectedIndexChanged" Width="101px">

        </asp:DropDownList>&nbsp;

        <asp:DropDownList ID="drpYearCal" runat="server" AutoPostBack="True" OnSelectedIndexChanged="drpCalYear_SelectedIndexChanged" Width="104px">

        </asp:DropDownList>

<asp:Label ID="lblDate" runat="server" Text="Label" Width="390px"></asp:Label>

 

Now you are ready with the web page.So you can start with the implementation.

 

protected void Page_Load(object sender, EventArgs e)

    {

         //Hide the title of the calendar control

        calSource.ShowTitle = false;   

       //Populate month and year dropdown list boxes which

       //replace the original calendar title

        if (!Page.IsPostBack)

        {   

            Populate_MonthddList();   

            Populate_YearddList();

        } 

        lblDate.Text = "Current date: " + calSource.TodaysDate;

    } 

    private void Populate_MonthddList()

    {

        drpMonthCal.Items.Add("January");

        drpMonthCal.Items.Add("February");

        drpMonthCal.Items.Add("March");

        drpMonthCal.Items.Add("April");

        drpMonthCal.Items.Add("May");

        drpMonthCal.Items.Add("June");

        drpMonthCal.Items.Add("July");

        drpMonthCal.Items.Add("August");

        drpMonthCal.Items.Add("September");

        drpMonthCal.Items.Add("October");

        drpMonthCal.Items.Add("November");

        drpMonthCal.Items.Add("December"); 

       // drpCalMonth.Items.FindByValue((objdate.Month.ToString())).Selected = true;

       // drpCalYear.Items.FindByValue(DateTime.Now.Month.ToString()).Selected = true;

    } 

    private void Populate_YearddList()

    {

        //Year list can be extended

        int intYear ;          

        for(intYear =Convert.ToInt16(DateTime.Now.Year) - 20;intYear<=DateTime.Now.Year + 20;intYear++)

        {  

             drpYearCal.Items.Add(Convert.ToString(intYear));

        }

        drpYearCal.Items.FindByValue(DateTime.Now.Year.ToString()).Selected = true; 

    }

    protected void calSource_SelectionChanged(object sender, EventArgs e)

    {

        if (calSource.SelectedDates.Count == 1)

            // If one date is selected, display it.

            lblDate.Text = "Selected date: " + calSource.SelectedDate;

        else

            // If multiple dates are selected, display them.

            lblDate.Text = "Selected dates: " + calSource.SelectedDates[0] + " to " + calSource.SelectedDates[calSource.SelectedDates.Count - 1]; 

    }

    protected void drpCalMonth_SelectedIndexChanged(object sender, EventArgs e)

    {

        calSource.TodaysDate =Convert.ToDateTime (drpMonthCal.SelectedItem.Value + " 1, " + drpYearCal.SelectedItem.Value);

    }

    protected void drpCalYear_SelectedIndexChanged(object sender, EventArgs e)

    {

        calSource.TodaysDate = Convert.ToDateTime(drpMonthCal.SelectedItem.Value + " 1, " + drpYearCal.SelectedItem.Value);

    }

 

After writing the code Run the application.

Now you will see the following output screen :-

 

8.gif

 

9.gif

 

10.gif