csharp

CalenderExtender Ajax

In this article, we will learn how to use CalenderExtender Ajax With ASP.NET.
Calendar extender is a part of Ajax Control Toolkit. I will show you each and every step on how to implement it.

CalenderExtender Ajax
Follow this step for using AJAX Control Toolkit Calendar Extender With ASP.NET.
Step 1: Open visual studio for Create a project.
Click File, New Project, then click ASP.NET Empty Web Site just like screenshot.
calenderextender-ajax

calenderextender-ajax

Step 2: Right, click on the Created project.
Click Add, Add New Item and then name the Web Form as WebForm1.aspx,
calenderextender-ajax

calenderextender-ajax

Step 3: Before using ajax CalendarExtender of Ajax Control Toolkit, first know where you will get Ajax Control Toolkit and how to add AjaxControlToolkit.
Click this link for Add ajax control toolkit in toolbox

Step 4: Here I am going to implement How to Use AJAX Control Toolkit Calendar Extender with TextBox.

step 5: ToolkitScriptManager is also required on the page to execute Ajax Control Kit items like Calendar Extender and the ToolkitScriptManager handles all dependency resolution. It is responsible for loading all of the JavaScript files required by a set of Ajax Control Toolkit controls.

Step 6: Open WebForm1.aspx page and then write this code.

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="AjaxCalender.WebForm1" %>

<%@ Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="asp" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div>
            <asp:ToolkitScriptManager ID="ToolkitScriptManager1" runat="server"></asp:ToolkitScriptManager>
            Pick Date:<asp:TextBox ID="txtdate" runat="server" ReadOnly="true"></asp:TextBox>
            <asp:ImageButton ID="image1" runat="server" ImageUrl="~/calender1.png" Width="25px" Height="25px" />
            <asp:CalendarExtender ID="CalendarExtender1" runat="server" TargetControlID="txtdate"
                PopupButtonID="image1" Format="dd/MM/yyyy">
            </asp:CalendarExtender>
        </div>
    </form>
</body>
</html>

Output
calenderextender-ajax

Any question and suggestion related to this CalenderExtender Ajax article lease comment.

Leave a Reply

Your email address will not be published. Required fields are marked *