A Calendar with Two Populated DropDownLists Demo

This demo shows the first step in enhancing the Calendar control - we've added two populated DropDownLists. Our next step is to allow the user to jump to a selected month/year.

<March 2021>
SunMonTueWedThuFriSat
28123456
78910111213
14151617181920
21222324252627
28293031123
45678910
 

<%@ Page Language="VB" %>
<script runat="server">

    Sub Page_Load(sender As Object, e As EventArgs)
    
         If Not Page.IsPostBack Then
    
             Call Populate_MonthList()
    
             Call Populate_YearList()
         End If
    End Sub
    
    
    Sub Populate_MonthList()
    
             drpCalMonth.Items.Add("January")
             drpCalMonth.Items.Add("February")
             drpCalMonth.Items.Add("March")
             drpCalMonth.Items.Add("April")
             drpCalMonth.Items.Add("May")
             drpCalMonth.Items.Add("June")
             drpCalMonth.Items.Add("July")
             drpCalMonth.Items.Add("August")
             drpCalMonth.Items.Add("September")
             drpCalMonth.Items.Add("October")
             drpCalMonth.Items.Add("November")
             drpCalMonth.Items.Add("December")
    
             drpCalMonth.Items.FindByValue(MonthName(DateTime.Now.Month)).Selected = True
    
    End Sub
    
    
    Sub Populate_YearList()
    
        'Year list can be extended
        Dim intYear As Integer
    
        For intYear = DateTime.Now.Year - 20 To DateTime.Now.Year + 20    
            drpCalYear.Items.Add(intYear)
        Next
    
        drpCalYear.Items.FindByValue(DateTime.Now.Year).Selected = True
    End Sub

</script>

<form id="frmCalendar" runat="server">
    <table>
        <tbody>
            <tr>
                <td>
                    <asp:DropDownList id="drpCalMonth" Runat="Server"></asp:DropDownList>
                    <asp:DropDownList id="drpCalYear" Runat="Server"></asp:DropDownList>
                </td>
            </tr>
            <tr>
                <td>
                    <asp:Calendar id="myCalendar" Runat="Server"></asp:Calendar>
                </td>
            </tr>
        </tbody>
    </table>
</form>

[Return to the article...]