Net-informations.com
SiteMap  | About    

Ajax CalendarExtender

The Ajax Control Toolkit contains controls that you can use to build highly responsive and interactive Ajax-enabled Web applications. Ajax toolkit has a CalendarExtender control which is very easily you can associate with a TextBox Control as well as a Button control.

CalendarExtender

The above picture shows an Ajax CalendarExtender associate with a Button control , the source code follows :

  

<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:Button ID="Button1" runat="server" Text="Select Date" />
<asp:CalendarExtender ID="CalendarExtender1" runat="server"
TargetControlID="TextBox1" PopupButtonID="Button1"/>

You can associate the CalendarExtender control to a Textbox control , the source code follows :

  

<asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
<asp:CalendarExtender ID="CalendarExtender2" runat="server"
TargetControlID="TextBox2" PopupButtonID="TextBox2"/>

You can create a Calendar Navigation by using Ajax CalendarExtender control , which you can Navigate Year , Month and select date from the Calendar control.

Calendar-navigation

Yo can copy and paste the following source code and run the program. To use the Ajax Control Toolkit in your Visual Studio project, you should add reference to the AjaxControlToolkit.dll in your project.

Default.aspx

  

<%@ Register assembly="AjaxControlToolkit" namespace="AjaxControlToolkit" tagprefix="asp" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
	<title>Untitled Page</title>
    <script type="text/javascript">
    function ShowNavigation(sender,args)
    {
       sender._switchMode("years", true);
    }
    </script>
</head>
<body>
	<form id="form1" runat="server">
	<div>
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <asp:Label ID="Label1" runat="server" Text="Click Select Date Button to view Calendar"></asp:Label>
        <br />
        <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
	    <asp:Button ID="Button1" runat="server" Text="Select Date" />
        <asp:CalendarExtender ID="CalendarExtender1" runat="server"
        TargetControlID="TextBox1" PopupButtonID="Button1"/>
	    <br />
        <br />
        <asp:Label ID="Label2" runat="server" Text="Click inside textbox to view Calendar"></asp:Label>
        <br />
        <asp:TextBox ID="TextBox2" runat="server"></asp:TextBox>
        <asp:CalendarExtender ID="CalendarExtender2" runat="server"
        TargetControlID="TextBox2" PopupButtonID="TextBox2"/>
	    <br />
        <br />
        <asp:Label ID="Label3" runat="server" Text="Calendar Navigation Sample"></asp:Label>
        <br />
        <asp:TextBox ID="TextBox3" runat="server"></asp:TextBox>
         <asp:CalendarExtender ID="CalendarExtender3"
        runat="server" TargetControlID="TextBox3" OnClientShown="ShowNavigation" />
	</div>
	</form>
</body>
</html>







net-informations.com (C) 2017    Founded by raps mk
All Rights Reserved. All other trademarks are property of their respective owners.