New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

WebForms Calendar Overview

Pick a Date
Wednesday, November 13, 2024
November 2024
November 2024
 SMTWTFS
44272829303112
453456789
4610111213141516
4717181920212223
4824252627282930
491234567

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 120+ 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