RadCalendar - Telerik ASP.NET Calendar

Calendar
Title and navigation
Title and navigation
<<<December, 2014><<
December, 2014
 SMTWTFS
4930123456
5078910111213
5114151617181920
5221222324252627
5328293031123
245678910
RadDatePicker
RadDatePicker
Open the calendar popup.
Isolate this demo as a stand-alone application

This demo illustrates the RadCalendar, RadDatePicker, RadTimePicker and RadDateTimePicker controls.

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 and various picker controls facilitate the interaction between the user and your web site and save you a lot of client-side scripting. Features include adjacent months preview, multi-month view, context menus, shared controls, a set of built-in skins and many more.

RadCalendar and 80+ 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
<%@ Page Language="c#"  %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<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" runat="server" id="Div2">
            <telerik:RadCalendar ID="RadCalendar1" Width="100%" EnableMultiSelect="true" EnableKeyboardNavigation="true"
                ShowColumnHeaders="true" ShowDayCellToolTips="true" ShowRowHeaders="true" runat="server"
                AutoPostBack="true">
                <FastNavigationSettings EnableTodayButtonSelection="true">
                </FastNavigationSettings>
            </telerik:RadCalendar>
            <div class="controls">
                <telerik:RadDatePicker runat="server" ID="RadDatePicker1" Width="100%">
                    <Calendar ID="Calendar1" runat="server" EnableKeyboardNavigation="true">
                    </Calendar>
                </telerik:RadDatePicker>
            </div>
            <div class="controls">
                <telerik:RadTimePicker ID="RadTimePicker1" Width="100%" runat="server"></telerik:RadTimePicker>
            </div>
            <div class="controls">
                <telerik:RadDateTimePicker runat="server" ID="RadDateTimePicker1" Width="100%">
                    <Calendar ID="Calendar4" runat="server" EnableKeyboardNavigation="true">
                    </Calendar>
                </telerik:RadDateTimePicker>
            </div>
        </div>
    </div>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?