Calendar

Pick a Date
Wednesday, September 30, 2020
September 2020
September 2020
 SMTWTFS
36303112345
376789101112
3813141516171819
3920212223242526
4027282930123
4145678910

This demo illustrates the RadCalendar for ASP.NET AJAX control.

About RadCalendar for ASP.NET AJAX

RadCalendar controls is a set of highly configurable components for displaying and selecting date and time values. The calendar facilitates the interaction between the user and your web site and saves you a lot of client-side scripting. Features include adjacent months preview, multi-month view, context menus, a set of built-in skins and many more.

RadCalendar and 90+ other controls are part of UI for ASP.NET AJAX, a comprehensive toolset taking care of the common functionality of your application, while leaving you with more time to work on its business logic.

Key Features

  • Flexible client-side API
  • A multi-view presentation for showing several months in a single control.
  • The ability to define special days for per-day customization.
  • Template support - including day templates as well as header and footer templates.
  • Keyboard navigation.
  • Visual Appeal - ships with rich set of skins for easy and consistent styling.

More about Calendar for ASP.NET AJAX
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • styles.css
<%@ Page  CodeFile="DefaultCS.aspx.cs" Language="c#" AutoEventWireup="true" Inherits="Telerik.Web.Examples.Calendar.Overview.DefaultCS"  %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <link href="styles.css" rel="Stylesheet" type="text/css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div id="Div1" class="demo-containers" runat="server">
        <div class="demo-container no-bg" runat="server" id="Div2">
            <span class="title">Pick a Date</span>
            <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1">
                <span class="picked-date"><em></em>
                    <asp:Label runat="server" Text="Monday, August 10, 2015" ID="Lable1"></asp:Label></span>
                <telerik:RadCalendar RenderMode="Lightweight" ID="RadCalendar1" Width="100%" EnableMultiSelect="false" EnableKeyboardNavigation="true"
                    ShowColumnHeaders="true" ShowDayCellToolTips="true" SelectedDate="08/10/2015" OnSelectionChanged="RadCalendar1_SelectionChanged" ShowRowHeaders="true" runat="server"
                    AutoPostBack="true">
                    <FastNavigationSettings EnableTodayButtonSelection="true">
                    </FastNavigationSettings>
                </telerik:RadCalendar>
            </telerik:RadAjaxPanel>
        </div>
        <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1"></telerik:RadAjaxLoadingPanel>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance