CalendarExtendar control of Ajax in asp.net

Introduction: In this article i am going to explain how to use Ajax calendar extendar control to show/display calendar to select the date while filing the date field e.g.  Date of Birth, Date of joining etc. on the registration form or other input forms.

Description: In previous article i explained How to install Ajax Control Toolkit in Visual Studio and How to allow only numbers, characters in the textbox using FilteredTextBoxExtender control of Ajax in asp.net and Ajax AutoCompleteExtender control example in asp.net using C#,VB.Net without using web service and Ajax AutoCompleteExtender control example in asp.net C#,VB.Net using web service.
While working on web application we frequently require taking the date input from the users e.g. while filling Date of Birth, Date of Joining etc. Ajax made it very easy by providing the CalendarExtendar control. We can implement it on the TextBoxes where user enters his DOB(Date of Birth) or DOJ(Date of joining) etc. Now when user click on TextBox a calendar appears and let the user select the appropriate date from the calendar. Thus it is very user friendly and convenient way to take the date inputs.

Implementation: Place a ScriptManager control, a TextBox and Label control from the Visual studio standard toolkit.
Also place CalendarExtendar control from the AjaxControlToolKit if you have already installed the AjaxControlToolkit.
  <asp:ScriptManager ID="ScriptManager1" runat="server">
    </asp:ScriptManager>

   <asp:TextBox ID="txtDOB" runat="server"></asp:TextBox>

        <asp:CalendarExtender ID="CalendarExtender1"
        PopupButtonID="txtDOB"
        PopupPosition="BottomLeft"
         TargetControlID="txtDOB"
          Format="dd/MM/yyyy"
          runat="server">
        </asp:CalendarExtender>

        <asp:Button ID="btnSubmit" runat="server" Text="Submit " onclick="btnSubmit_Click" />

        <asp:Label ID="lblDOB" runat="server" Text=""></asp:Label>

C#.Net Code to implement CalendarExtendar control of Ajax in asp.net

  • Now in code behind file (.aspx.cs) write the code on Submit button click event as:
protected void btnSubmit_Click(object sender, EventArgs e)
    {
        lblDOB.Text = "Your Date of Birth is: " + txtDOB.Text;
    }

VB.Net Code to implement CalendarExtendar control of Ajax in asp.net
  • Now in code behind file (.aspx.vb) write the code on Submit button click event as:
Protected Sub btnSubmit_Click(sender As Object, e As EventArgs)
                    lblDOB.Text = "Your Date of Birth is: " + txtDOB.Text
End Sub

Previous
Next Post »

2 comments

Click here for comments
RD
admin
October 04, 2013 ×

itx not Working :/

Reply
avatar
October 04, 2013 ×

Hi RD..this code is completely tested and working..what problem you are facing?

Reply
avatar

If you have any question about any post, Feel free to ask.You can simply drop a comment below post or contact via Contact Us form. Your feedback and suggestions will be highly appreciated. Also try to leave comments from your account not from the anonymous account so that i can respond to you easily..