previous daynext daytoday
RadScheduler exposes many properties that allow you to customize its appearance.
The individual parts such as header and footer might be turned on or off. The format of the dates displayed in various places can be customized.
Setting WorkDayStartTime and WorkDayEndTime causes RadScheduler to apply the rsNonWorkHour class to days that do not fall in the specified range. You can customize the appearance of non working days with the following css selector:
.RadScheduler_Vista .rsNonWorkHour { background-color: #f5fcff; }
<%@ Page Language="C#" AutoEventWireup="true" Inherits="Telerik.Web.Examples.Scheduler.Customization.DefaultCS" CodeFile="DefaultCS.aspx.cs" %><%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %><%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %><%@ Register TagPrefix="qsf" TagName="Header" Src="~/Common/Header.ascx" %><%@ Register TagPrefix="qsf" TagName="HeadTag" Src="~/Common/HeadTag.ascx" %><%@ Register TagPrefix="qsf" TagName="Footer" Src="~/Common/Footer.ascx" %><%@ Register TagPrefix="sds" Namespace="Telerik.Web.SessionDS" %><!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"> <qsf:HeadTag ID="Headtag1" runat="server" /> <style type="text/css"> .ConfigurationPanel1 .ConfigSection { margin-left: 10px; list-style: none; width: 220px; float: left; padding-left: 11px; border-left: solid 1px #b1d8eb; height: 220px; padding-right: 0; padding-top: 0; padding-bottom: 0; } .ConfigurationPanel1 .ConfigSection li { line-height: 24px; } .ConfigurationPanel1 .ConfigSection li select { margin-left: 20px; float: right; width: 80px; } .RadScheduler_Vista .rsContentTable .rsNonWorkHour { background-color: #BCADAD; } .holder { min-height: 0; _zoom: 1; } .holder:after { content: ""; height: 0; clear: both; display: block; } #scheduler-container { width: 600px; float: left; } #settings-container { width: 250px; float: right; } </style></head><body class="BODY"> <form id="Form1" method="post" runat="server"> <qsf:Header ID="Header1" runat="server" NavigationLanguage="C#" /> <telerik:RadScriptManager runat="server" ID="RadScriptManager1" /> <script type="text/javascript"> var lastExpandedPanelId = null; var slideConfigOrig = slideConfig; function pageLoad() { $telerik.$(document).ready(function () { if ($telerik.$(".cfgHead[href*=Up]").parent().parent()[0]) { lastExpandedPanelId = $telerik.$(".cfgHead[href*=Up]").parent().parent()[0].id; } }); slideConfig = function (uniqudId, dir) { if (dir == 'Down') { if (lastExpandedPanelId) slideConfigOrig(lastExpandedPanelId, 'Up'); lastExpandedPanelId = uniqudId; } slideConfigOrig(uniqudId, dir); }; } </script> <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" EnableAJAX="true"> <AjaxSettings> <telerik:AjaxSetting AjaxControlID="Panel1"> <UpdatedControls> <telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1" /> <telerik:AjaxUpdatedControl ControlID="EntireScheduler" /> <telerik:AjaxUpdatedControl ControlID="Appointments" /> <telerik:AjaxUpdatedControl ControlID="HeaderAndFooter" /> <telerik:AjaxUpdatedControl ControlID="HoursColumn" /> <telerik:AjaxUpdatedControl ControlID="DayWeekMultidayView" /> <telerik:AjaxUpdatedControl ControlID="MonthView_ConfigurationPanel" /> <telerik:AjaxUpdatedControl ControlID="TimeLineView_ConfigurationPanel" /> <telerik:AjaxUpdatedControl ControlID="Localization" /> </UpdatedControls> </telerik:AjaxSetting> </AjaxSettings> </telerik:RadAjaxManager> <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1" /> <asp:Panel runat="Server" ID="Panel1" CssClass="holder"> <div id="scheduler-container"> <telerik:RadScheduler runat="server" ID="RadScheduler1" SelectedDate="2012-04-16" Width="600" DayStartTime="08:00:00" DayEndTime="18:00:00" TimeZoneOffset="03:00:00" DataSourceID="AppointmentsDataSource" DataKeyField="ID" DataStartField="Start" DataEndField="End" DataSubjectField="Subject" DataRecurrenceField="RecurrenceRule" DataRecurrenceParentKeyField="RecurrenceParentID" DataReminderField="Reminder" DataTimeZoneIdField="TimeZoneID" AppointmentStyleMode="Default" OnAppointmentCreated="RadScheduler1_AppointmentCreated" TimeZoneID="FLE Standard Time" OnAppointmentDataBound="RadScheduler1_AppointmentDataBound"> <AdvancedForm Modal="true" /> <WeekView HeaderDateFormat="d" /> <ResourceTypes> <telerik:ResourceType KeyField="ID" Name="Room" TextField="RoomName" ForeignKeyField="RoomID" DataSourceID="RoomsDataSource" /> <telerik:ResourceType KeyField="ID" Name="User" TextField="UserName" ForeignKeyField="UserID" DataSourceID="UsersDataSource" /> </ResourceTypes> <AppointmentTemplate> <div> <%# Eval("Subject") %></div> <div style="font-style: italic;"> <%# Eval("Description") %></div> </AppointmentTemplate> <TimeSlotContextMenuSettings EnableDefault="true" /> <AppointmentContextMenuSettings EnableDefault="true" /> </telerik:RadScheduler> </div> <telerik:RadToolTipManager ID="RadToolTipManager1" runat="server" ToolTipZoneID="configuratorPanel" AutoTooltipify="true"> </telerik:RadToolTipManager> <div id="settings-container"> <qsf:ConfiguratorPanel runat="server" ID="EntireScheduler" CssClass="ConfigurationPanel1" Width="250" Expanded="true" Title="Entire Scheduler"> <ul style="margin-left: 0; border-left: none" class="ConfigSection"> <li> <asp:DropDownList runat="server" ID="OverflowBehavior" AutoPostBack="true"> <asp:ListItem Value="Scroll" Text="Scroll" Selected="true"></asp:ListItem> <asp:ListItem Value="Expand" Text="Expand"></asp:ListItem> </asp:DropDownList> <asp:Label ID="Label1" runat="server" Text="Overflow behavior:" ToolTip="Controlled by the <b>OverflowBehavior</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="AdvancedFormEnabled" AutoPostBack="true" Text="Advanced Form" Checked="true" ToolTip="Controlled by the <b>AdvancedForm-Enabled</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="StartInsertingInAdvancedForm" AutoPostBack="true" Text="Insert in Advanced Form" Checked="false" ToolTip="Controlled by the <b>StartInsertingInAdvancedForm</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="StartEditingInAdvancedForm" AutoPostBack="true" Text="Edit in Advanced Form" Checked="true" ToolTip="Controlled by the <b>StartEditingInAdvancedForm</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="AdvancedFormModal" AutoPostBack="true" Text="Modal Advanced Form" Checked="true" ToolTip="Controlled by the <b>AdvancedForm.Modal</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="EnableResourceEditing" AutoPostBack="true" Text="Resource editing" Checked="true" ToolTip="Controlled by the <b>EnableResourceEditing</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="EnableCustomAttributeEditing" AutoPostBack="true" Text="Custom Attribute editing" Checked="true" ToolTip="Controlled by the <b>EnableCustomAttributeEditing</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="TimeSlotContextMenuSettingsEnableDefault" AutoPostBack="true" Text="TimeSlot Context Menu" Checked="true" ToolTip="Controlled by the <b>TimeSlotContextMenuSettings-EnableDefault</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="EnableTimeZonesEditing" AutoPostBack="true" Text="Time Zones editing" Checked="false" ToolTip="Controlled by the <b>AdvancedForm-EnableTimeZonesEditing</b> property." /> </li> </ul> <div style="clear: both;"> </div> </qsf:ConfiguratorPanel> <qsf:ConfiguratorPanel runat="server" ID="Appointments" CssClass="ConfigurationPanel1" Width="250" Expanded="false" Title="Appointments"> <ul style="margin-left: 0; border-left: none" class="ConfigSection"> <li> <asp:CheckBox runat="server" ID="AllowInsert" AutoPostBack="true" Text="Allow insert" Checked="true" ToolTip="Controlled by the <b>AllowInsert</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="AllowEdit" AutoPostBack="true" Text="Allow edit" Checked="true" ToolTip="Controlled by the <b>AllowEdit</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="AllowDelete" AutoPostBack="true" Text="Allow delete" Checked="true" ToolTip="Controlled by the <b>AllowDelete</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="DisplayDeleteConfirmation" AutoPostBack="true" Text="Delete confirmation" Checked="false" ToolTip="Controlled by the <b>DisplayDeleteConfirmation</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="DisplayRecurrenceActionDialogOnMove" AutoPostBack="true" Text="Moving recurrence confirmation" Checked="false" ToolTip="Controlled by the <b>DisplayRecurrenceActionDialogOnMove</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="EnableDescriptionField" AutoPostBack="true" Text="Description Field" Checked="true" ToolTip="Controlled by the <b>EnableDescriptionField</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="AppointmentContextMenuSettingsEnableDefault" AutoPostBack="true" Text="Context Menu" Checked="true" ToolTip="Controlled by the <b>AppointmentContextMenuSettings-EnableDefault</b> property." /> </li> <li> <telerik:RadColorPicker ID="RadColorPickerColorAppointments" runat="server" AutoPostBack="true" Height="300px" PaletteModes="HSV" ShowIcon="true" Width="300px" Style="float: right;" /> <asp:Label ID="Label11" runat="server" Text="Appointment color:" ToolTip="Controlled by the <b>Appointment.BackColor</b> property." /> </li> </ul> <div style="clear: both;"> </div> </qsf:ConfiguratorPanel> <qsf:ConfiguratorPanel runat="server" ID="HeaderAndFooter" CssClass="ConfigurationPanel1" Expanded="false" Title="Header and Footer" Width="250"> <ul style="margin-left: 0; border-left: none; height: 320px" class="ConfigSection"> <li><b>Header</b></li> <li> <asp:CheckBox runat="server" ID="ShowHeader" AutoPostBack="true" Text="Header" Checked="true" ToolTip="Controlled by the <b>ShowHeader</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="ShowNavigationPane" AutoPostBack="true" Text="Show navigation pane" Checked="true" ToolTip="Controlled by the <b>ShowNavigationPane</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="ShowViewTabs" AutoPostBack="true" Text="View tabs" Checked="true" ToolTip="Controlled by the <b>ShowViewTabs</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="EnableDatePicker" AutoPostBack="true" Text="Date picker" Checked="true" ToolTip="Controlled by the <b>EnableDatePicker</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="DayView" AutoPostBack="true" Text="DayView" Checked="true" ToolTip="Controlled by the <b>DayView.UseSelectable</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="WeekView" AutoPostBack="true" Text="WeekView" Checked="true" ToolTip="Controlled by the <b>WeekView.UseSelectable</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="MonthView" AutoPostBack="true" Text="MonthView" Checked="true" ToolTip="Controlled by the <b>MonthView.UseSelectable</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="TimelineView" AutoPostBack="true" Text="TimelineView" Checked="true" ToolTip="Controlled by the <b>TimelineView.UseSelectable</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="MultiDayView" AutoPostBack="true" Text="Multi-day" Checked="true" ToolTip="Controlled by the <b>Multi-day.UseSelectable</b> property." /> </li> <li><b>Footer</b></li> <li> <asp:CheckBox runat="server" ID="CheckBoxShowFooter" AutoPostBack="true" Text="Footer" Checked="true" ToolTip="Controlled by the <b>ShowFooter</b> property." /> </li> <li> <asp:Label runat="server" Text="Time mode:" ToolTip="Controlled by the <b>ShowFullTime</b> property." /> <asp:DropDownList runat="server" ID="ShowFullTime" AutoPostBack="true" Width="121px"> <asp:ListItem Value="Business Hours" Text="Business Hours" Selected="true"></asp:ListItem> <asp:ListItem Value="24 Hours" Text="24 Hours"></asp:ListItem> </asp:DropDownList> </li> </ul> <div style="clear: both;"> </div> </qsf:ConfiguratorPanel> <qsf:ConfiguratorPanel runat="server" ID="HoursColumn" CssClass="ConfigurationPanel1" Expanded="false" Title="Hours Column" Width="250"> <ul style="border-left: none; height: 130px;" class="ConfigSection"> <li> <asp:CheckBox runat="server" ID="ShowHoursColumn" AutoPostBack="true" Text="Hours column" Checked="true" ToolTip="Controlled by the <b>ShowHoursColumn</b> property." /> </li> <li> <asp:Label runat="server" Text="Row header width:" ToolTip="Controlled by the <b>RowHeaderWidth</b> property." /> <asp:DropDownList runat="server" ID="RowHeaderWidth" AutoPostBack="true" Width="60"> <asp:ListItem Value="65px" Text="65px"></asp:ListItem> <asp:ListItem Value="85px" Text="85px" Selected="true"></asp:ListItem> <asp:ListItem Value="100px" Text="100px"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Hours panel time format:" ToolTip="Controlled by the <b>HoursPanelTimeFormat</b> property." /> <asp:DropDownList runat="server" ID="HoursPanelTimeFormat" AutoPostBack="true" Width="60"> <asp:ListItem Value="H:mm" Text="H:mm" Selected="true"></asp:ListItem> <asp:ListItem Value="H:mm:ss" Text="H:mm:ss"></asp:ListItem> <asp:ListItem Value="t" Text="t"></asp:ListItem> <asp:ListItem Value="T" Text="T"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Time label row span:" ToolTip="Controlled by the <b>TimeLabelRowSpan</b> property." /> <asp:DropDownList runat="server" ID="TimeLabelRowSpan" AutoPostBack="true" Width="60"> <asp:ListItem Value="1" Text="1"></asp:ListItem> <asp:ListItem Value="2" Text="2" Selected="true"></asp:ListItem> <asp:ListItem Value="3" Text="3"></asp:ListItem> <asp:ListItem Value="4" Text="4"></asp:ListItem> </asp:DropDownList> </li> </ul> </qsf:ConfiguratorPanel> <qsf:ConfiguratorPanel runat="server" ID="DayWeekMultidayView" CssClass="ConfigurationPanel1" Expanded="false" Title="Day, Week and MultiDay Views" Width="250"> <ul style="margin-left: 0; border-left: none; height: 300px;" class="ConfigSection"> <li> <asp:Label runat="server" Text="Header Date Format:" ToolTip="Controlled by the <b>HeaderDateFormat</b> property." /> <asp:DropDownList runat="server" ID="HeaderDateFormat" AutoPostBack="true" Width="80"> <asp:ListItem Value="ddd-MM" Text="ddd-MM"></asp:ListItem> <asp:ListItem Value="MMM-dd" Text="MMM-dd" Selected="true"></asp:ListItem> <asp:ListItem Value="MM-dd-yy" Text="MM-dd-yy"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:CheckBox runat="server" ID="ShowAllDayRow" AutoPostBack="true" Text="All-Day row" Checked="true" ToolTip="Controlled by the <b>ShowAllDayRow</b> property." /> </li> <li> <asp:Label runat="server" Text="Minutes per row:" ToolTip="Controlled by the <b>MinutesPerRow</b> property." /> <asp:DropDownList runat="server" ID="MinutesPerRow" AutoPostBack="true" Width="60"> <asp:ListItem Value="60" Text="60"></asp:ListItem> <asp:ListItem Value="30" Text="30" Selected="true"></asp:ListItem> <asp:ListItem Value="15" Text="15"></asp:ListItem> <asp:ListItem Value="10" Text="10"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Row height:" ToolTip="Controlled by the <b>RowHeight</b> property." /> <asp:DropDownList runat="server" ID="RowHeight" AutoPostBack="true" Width="60"> <asp:ListItem Value="16px" Text="16px"></asp:ListItem> <asp:ListItem Value="25px" Text="25px" Selected="true"></asp:ListItem> <asp:ListItem Value="50px" Text="50px"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Day start:" ToolTip="Controlled by the <b>DayStartTime</b> property." /> <asp:DropDownList runat="server" ID="DayStart" AutoPostBack="true" Width="60"> <asp:ListItem Value="06:00:00" Text="06:00"></asp:ListItem> <asp:ListItem Value="07:00:00" Text="07:00"></asp:ListItem> <asp:ListItem Value="08:00:00" Text="08:00" Selected="true"></asp:ListItem> <asp:ListItem Value="09:00:00" Text="09:00"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Day end:" ToolTip="Controlled by the <b>DayEndTime</b> property." /> <asp:DropDownList runat="server" ID="DayEnd" AutoPostBack="true" Width="60"> <asp:ListItem Value="15:00:00" Text="15:00"></asp:ListItem> <asp:ListItem Value="16:00:00" Text="16:00"></asp:ListItem> <asp:ListItem Value="17:00:00" Text="17:00" Selected="true"></asp:ListItem> <asp:ListItem Value="18:00:00" Text="18:00"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Work day start:" ToolTip="Controlled by the <b>WorkDayStartTime</b> property." /> <asp:DropDownList runat="server" ID="WorkDayStart" AutoPostBack="true" Width="60"> <asp:ListItem Value="08:00:00" Text="08:00" Selected="true"></asp:ListItem> <asp:ListItem Value="09:00:00" Text="09:00"></asp:ListItem> <asp:ListItem Value="10:00:00" Text="10:00"></asp:ListItem> <asp:ListItem Value="11:00:00" Text="11:00"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label ID="Label7" runat="server" Text="Work day end:" ToolTip="Controlled by the <b>WorkDayEndTime</b> property." /> <asp:DropDownList runat="server" ID="WorkDayEnd" AutoPostBack="true" Width="60"> <asp:ListItem Value="16:00:00" Text="16:00"></asp:ListItem> <asp:ListItem Value="17:00:00" Text="17:00" Selected="true"></asp:ListItem> <asp:ListItem Value="19:00:00" Text="19:00"></asp:ListItem> </asp:DropDownList> </li> <li><b>Only for WeekView</b></li> <li> <asp:Label ID="Label3" runat="server" Text="First day of week:" ToolTip="Controlled by the <b>FirstDayOfWeek</b> property." /> <asp:DropDownList runat="server" ID="FirstDayOfWeek" AutoPostBack="true" Width="100"> <asp:ListItem Value="Sunday" Text="Sunday" Selected="true"></asp:ListItem> <asp:ListItem Value="Monday" Text="Monday"></asp:ListItem> <asp:ListItem Value="Tuesday" Text="Tuesday"></asp:ListItem> <asp:ListItem Value="Wednesday" Text="Wednesday"></asp:ListItem> <asp:ListItem Value="Thursday" Text="Thursday"></asp:ListItem> <asp:ListItem Value="Friday" Text="Friday"></asp:ListItem> <asp:ListItem Value="Saturday" Text="Saturday"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label ID="Label4" runat="server" Text="Last day of week:" ToolTip="Controlled by the <b>LastDayOfWeek</b> property." /> <asp:DropDownList runat="server" ID="LastDayOfWeek" AutoPostBack="true" Width="100"> <asp:ListItem Value="Sunday" Text="Sunday"></asp:ListItem> <asp:ListItem Value="Monday" Text="Monday"></asp:ListItem> <asp:ListItem Value="Tuesday" Text="Tuesday"></asp:ListItem> <asp:ListItem Value="Wednesday" Text="Wednesday"></asp:ListItem> <asp:ListItem Value="Thursday" Text="Thursday"></asp:ListItem> <asp:ListItem Value="Friday" Text="Friday"></asp:ListItem> <asp:ListItem Value="Saturday" Text="Saturday" Selected="true"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label ID="Label12" runat="server" Text="Column Header Format:" ToolTip="Controlled by the <b>ColumnHeaderDateFormat</b> property." /> <asp:DropDownList runat="server" ID="DayWeekMultidayViewColumnHeaderDateFormat" AutoPostBack="true" Width="60"> <asp:ListItem Value="d" Text="d"></asp:ListItem> <asp:ListItem Value="dd" Text="dd" Selected="true"></asp:ListItem> <asp:ListItem Value="ddd" Text="ddd"></asp:ListItem> <asp:ListItem Value="dddd" Text="dddd"></asp:ListItem> </asp:DropDownList> </li> </ul> <div style="clear: both;"> </div> </qsf:ConfiguratorPanel> <qsf:ConfiguratorPanel runat="server" ID="MonthView_ConfigurationPanel" CssClass="ConfigurationPanel1" Expanded="false" Title="MonthView" Width="250"> <ul style="border-left: none; height: 200px;" class="ConfigSection"> <li> <asp:CheckBox runat="server" ID="AdaptiveRowHeight" AutoPostBack="true" Text="Adaptive Row Height" Checked="false" ToolTip="Controlled by the <b>MonthView.AdaptiveRowHeight</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="ShowDateHeader" AutoPostBack="true" Text="Date Headers" Checked="true" ToolTip="Controlled by the <b>MonthView.ShowDateHeader</b> property." /> </li> <li> <asp:Label runat="server" Text="Day Header Date Format:" ToolTip="Controlled by the <b>MonthView.DayHeaderDateFormat</b> property." /> <asp:DropDownList runat="server" ID="MonthViewDayHeaderDateFormat" AutoPostBack="true" Width="60"> <asp:ListItem Value="d" Text="d"></asp:ListItem> <asp:ListItem Value="dd" Text="dd" Selected="true"></asp:ListItem> <asp:ListItem Value="ddd" Text="ddd"></asp:ListItem> <asp:ListItem Value="dddd" Text="dddd"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Column Header Format:" ToolTip="Controlled by the <b>MonthView.ColumnHeaderDateFormat</b> property." /> <asp:DropDownList runat="server" ID="MonthViewColumnHeaderDateFormat" AutoPostBack="true" Width="60"> <asp:ListItem Value="dd" Text="dd"></asp:ListItem> <asp:ListItem Value="ddd" Text="ddd" Selected="true"></asp:ListItem> <asp:ListItem Value="dddd" Text="dddd"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="First Day Format:" ToolTip="Controlled by the <b>MonthView.FirstDayHeaderDateFormat</b> property." /> <asp:DropDownList runat="server" ID="FirstDayHeaderDateFormat" AutoPostBack="true" Width="60"> <asp:ListItem Value="d" Text="d"></asp:ListItem> <asp:ListItem Value="dd" Text="dd" Selected="true"></asp:ListItem> <asp:ListItem Value="ddd" Text="ddd"></asp:ListItem> <asp:ListItem Value="dddd" Text="dddd"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Header Date Formats:" ToolTip="Controlled by the <b>MonthView.HeaderDateFormat</b> property." /> <asp:DropDownList runat="server" ID="MonthViewHeaderDateFormat" AutoPostBack="true" Width="60"> <asp:ListItem Value="ddd-MM" Text="ddd-MM"></asp:ListItem> <asp:ListItem Value="MMM-dd" Text="MMM-dd" Selected="true"></asp:ListItem> <asp:ListItem Value="MM-dd-yy" Text="MM-dd-yy"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Minimal Row Height:" ToolTip="Controlled by the <b>MonthView.MinimumRowHeight</b> property." /> <asp:DropDownList runat="server" ID="MinimumRowHeight" AutoPostBack="true" Width="60"> <asp:ListItem Value="4" Text="4px" Selected="true"></asp:ListItem> <asp:ListItem Value="5" Text="5px"></asp:ListItem> <asp:ListItem Value="7" Text="7px"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Visible Appointments" ToolTip="Controlled by the <b>MonthView.VisibleAppointmentsPerDay </b> property." /> <asp:DropDownList runat="server" ID="VisibleAppointmentsPerDay" AutoPostBack="true" Width="60"> <asp:ListItem Value="1" Text="1"></asp:ListItem> <asp:ListItem Value="2" Text="2" Selected="true"></asp:ListItem> <asp:ListItem Value="3" Text="3"></asp:ListItem> <asp:ListItem Value="4" Text="4"></asp:ListItem> </asp:DropDownList> </li> </ul> </qsf:ConfiguratorPanel> <qsf:ConfiguratorPanel runat="server" ID="TimeLineView_ConfigurationPanel" CssClass="ConfigurationPanel1" Expanded="false" Title="TimeLineView" Width="250"> <ul style="border-left: none; height: 200px;" class="ConfigSection"> <li> <asp:CheckBox runat="server" ID="ShowInsertArea" AutoPostBack="true" Text="Show Insert Area" Checked="false" ToolTip="Controlled by the <b>TimelineView.ShowInsertArea</b> property." /> </li> <li> <asp:CheckBox runat="server" ID="TimeLineShowDateHeader" AutoPostBack="true" Text="Date Headers" Checked="true" ToolTip="Controlled by the <b>ShowDateHeader</b> property." /> </li> <li> <asp:Label runat="server" Text="Column Header Format:" ToolTip="Controlled by the <b>TimelineView.ColumnHeaderDateFormat</b> property." /> <asp:DropDownList runat="server" ID="TimeLineColumnHeaderDateFormat" AutoPostBack="true" Width="60"> <asp:ListItem Value="ddd-MM" Text="ddd-MM"></asp:ListItem> <asp:ListItem Value="MMM-dd" Text="MMM-dd" Selected="true"></asp:ListItem> <asp:ListItem Value="MM-dd-yy" Text="MM-dd-yy"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Header Date Format:" ToolTip="Controlled by the <b>TimelineView.HeaderDateFormat</b> property." /> <asp:DropDownList runat="server" ID="TimeLineHeaderDateFormat" AutoPostBack="true" Width="60"> <asp:ListItem Value="ddd-MM" Text="ddd-MM"></asp:ListItem> <asp:ListItem Value="MMM-dd" Text="MMM-dd" Selected="true"></asp:ListItem> <asp:ListItem Value="MM-dd-yy" Text="MM-dd-yy"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Number of Slots:" ToolTip="Controlled by the <b>TimelineView.NumberOfSlots</b> property." /> <asp:DropDownList runat="server" ID="NumberOfSlots" AutoPostBack="true" Width="60"> <asp:ListItem Value="3" Text="3" Selected="true"></asp:ListItem> <asp:ListItem Value="4" Text="4"></asp:ListItem> <asp:ListItem Value="7" Text="7"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Slot Duration:" ToolTip="Controlled by the <b>TimelineView.SlotDuration </b> property." /> <asp:DropDownList runat="server" ID="SlotDuration" AutoPostBack="true" Width="100"> <asp:ListItem Value="12:00:00" Text="half day "></asp:ListItem> <asp:ListItem Value="08:00:00" Text="quater days"></asp:ListItem> <asp:ListItem Value="1.00:00:00" Text="1 day"></asp:ListItem> <asp:ListItem Value="2.00:00:00" Text="2 days" Selected="true"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label runat="server" Text="Time label span:" ToolTip="Controlled by the <b>TimelineView.TimeLabelSpan</b> property." /> <asp:DropDownList runat="server" ID="TimeLabelSpan" AutoPostBack="true" Width="60"> <asp:ListItem Value="1" Text="1" Selected="true"></asp:ListItem> <asp:ListItem Value="2" Text="2"></asp:ListItem> <asp:ListItem Value="3" Text="3"></asp:ListItem> <asp:ListItem Value="4" Text="4"></asp:ListItem> </asp:DropDownList> </li> <li> <asp:Label ID="Label2" runat="server" Text="Start time:" ToolTip="Controlled by the <b>TimelineView.StartTime</b> property." /> <asp:DropDownList runat="server" ID="TimelineViewStartTime" AutoPostBack="true" Width="60"> <asp:ListItem Value="00:00:00" Text="00:00" Selected="true"></asp:ListItem> <asp:ListItem Value="10:00:00" Text="10:00"></asp:ListItem> <asp:ListItem Value="20:00:00" Text="20:00"></asp:ListItem> </asp:DropDownList> </li> </ul> </qsf:ConfiguratorPanel> <qsf:ConfiguratorPanel runat="server" ID="Localization" CssClass="ConfigurationPanel1" Expanded="false" Title="Localization" Width="250"> <ul style="border-left: none; height: 200px;" class="ConfigSection"> <li><b>Change Localization</b></li> <li> <telerik:RadTextBox runat="server" ID="RadTextBoxTimeline" Label="Timeline tab" Width="200" ToolTip="Controlled by the <b>Localization.HeaderTimeline</b> property."> </telerik:RadTextBox> </li> <li> <telerik:RadTextBox runat="server" ID="RadTextBoxToday" Label="Today link" Width="200" ToolTip="Controlled by the <b>Localization.HeaderToday</b> property."> </telerik:RadTextBox> </li> <li> <telerik:RadTextBox runat="server" ID="RadTextBoxShow24" Label="Show 24 hours" Width="200" ToolTip="Controlled by the <b>Localization.Show24Hours</b> property."> </telerik:RadTextBox> </li> <li> <telerik:RadTextBox runat="server" ID="RadTextBoxInlineSave" Label="Inline Save" ToolTip="Controlled by the <b>Localization.Save</b> property." Width="200"> </telerik:RadTextBox> </li> <li> <telerik:RadTextBox runat="server" ID="RadTextBoxSubject" Label="Subject" Width="200" ToolTip="Controlled by the <b>Localization.AdvancedSubject</b> property."> </telerik:RadTextBox> </li> <li> <telerik:RadTextBox runat="server" ID="RadTextBoxNewAppointment" Label="New Appointment" ToolTip="Controlled by the <b>Localization.AdvancedNewAppointment</b> property." Width="200"> </telerik:RadTextBox> </li> <li> <telerik:RadButton runat="server" ID="RadButton1" Text="Apply localizations" UseSubmitBehavior="true"> </telerik:RadButton> </li> </ul> </qsf:ConfiguratorPanel> </div> </asp:Panel> <sds:SessionDataSource ID="AppointmentsDataSource" runat="server" DisplayWarning="false" PrimaryKeyFields="ID" ProviderName="System.Data.SqlClient" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString %>" SelectCommand="SELECT * FROM [Appointments]" InsertCommand="INSERT INTO [Appointments] ([Subject], [Start], [End], [RoomID], [UserID], [RecurrenceRule], [RecurrenceParentID], [TimeZoneID]) VALUES (@Subject, @Start, @End , @RoomID, @UserID, @RecurrenceRule, @RecurrenceParentID, @TimeZoneID)" UpdateCommand="UPDATE [Appointments] SET [Subject] = @Subject, [Start] = @Start, [End] = @End, [RoomID] = @RoomID, [UserID] = @UserID, [RecurrenceRule] = @RecurrenceRule, [RecurrenceParentID] = @RecurrenceParentID, [TimeZoneID] = @TimeZoneID WHERE (ID = @ID)" DeleteCommand="DELETE FROM [Appointments] WHERE [ID] = @ID"> <DeleteParameters> <asp:Parameter Name="ID" Type="Int32" /> </DeleteParameters> <UpdateParameters> <asp:Parameter Name="ID" Type="Int32" /> <asp:Parameter Name="Subject" Type="String" /> <asp:Parameter Name="Start" Type="DateTime" /> <asp:Parameter Name="End" Type="DateTime" /> <asp:Parameter Name="RoomID" Type="Int32" /> <asp:Parameter Name="UserID" Type="Int32" /> <asp:Parameter Name="RecurrenceRule" Type="String" /> <asp:Parameter Name="RecurrenceParentID" Type="Int32" /> <asp:Parameter Name="TimeZoneID" Type="String" /> </UpdateParameters> <InsertParameters> <asp:Parameter Name="Subject" Type="String" /> <asp:Parameter Name="Start" Type="DateTime" /> <asp:Parameter Name="End" Type="DateTime" /> <asp:Parameter Name="RoomID" Type="Int32" /> <asp:Parameter Name="UserID" Type="Int32" /> <asp:Parameter Name="RecurrenceRule" Type="String" /> <asp:Parameter Name="RecurrenceParentID" Type="Int32" /> <asp:Parameter Name="TimeZoneID" Type="String" /> </InsertParameters> </sds:SessionDataSource> <sds:SessionDataSource ID="RoomsDataSource" runat="server" DisplayWarning="false" ProviderName="System.Data.SqlClient" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString %>" SelectCommand="SELECT * FROM [Rooms]"> </sds:SessionDataSource> <sds:SessionDataSource ID="UsersDataSource" runat="server" DisplayWarning="false" ProviderName="System.Data.SqlClient" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString %>" SelectCommand="SELECT * FROM [Users]"> </sds:SessionDataSource> <qsf:Footer runat="server" ID="Footer1" /></form></body></html>
Take your time to truly experience the power of RadControls for ASP.NET AJAX with a free 60-day trial backed up by Telerik’s unlimited dedicated support.
Download your RadControls for ASP.NET AJAX trial and jumpstart your development with the available Getting Started resources.
If you have any questions, do not hesitate to contact us at sales@telerik.com.