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

Resource Availability

  • today
April 2012
April 2012
SMTWTFS
       
1234567
891011121314
15161718192021
22232425262728
2930     
Monday, April 16, 2012
  • Day
  • Week
Meeting room 101
Meeting room 201
all day
8AM
​
9AM
​
10AM
​
11AM
​
12PM
​
1PM
​
2PM
​
3PM
​
4PM
​
5PM
​
test
Held by: Alex
Project specification meeting
Held by: Charlie
sss
Held by: Alex
DADAD
Held by: Bob
Test
Held by: Alex
da
Held by: Alex
test
Held by: Bob
hgf
Held by: Bob
adfafd
Held by: Charlie
ht
Held by: Bob
ỷt
Held by: Charlie
Show 24 hours...
  • Edit
  • Delete
  • New Appointment
  • Go to today
  • Show 24 hours...

This example demonstrates how to use the client-side API to restrict appointment creation and rescheduling. Detailed comments are available in the ASPX code.

Please note that the changes in the data will be persisted per Session only. The data will be reset next time you visit the page.

This example demonstrates how to track resource availability. RadScheduler appointments depict meetings held by different users.

  1. You cannot create new meeting if there is a meeting scheduled in the same room.
  2. A user cannot have two meetings at the same time (the dropdown in the insert form displays only the available users).
  3. A meeting cannot be rescheduled to overlap with other meetings.
  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • scripts.js
  • styles.css
<%@ Page Language="C#" AutoEventWireup="true" Inherits="Scheduler.Examples.ResourceAvailability.DefaultCS"CodeFile="DefaultCS.aspx.cs"  %>

<%@ Register TagPrefix="sds" Namespace="Telerik.Web.SessionDS" %>
<%@ 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 rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadScheduler1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadScheduler1" LoadingPanelID="RadAjaxLoadingPanel1">
                    </telerik:AjaxUpdatedControl>
                </UpdatedControls>
            </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>
    <telerik:RadAjaxLoadingPanel runat="server" ID="RadAjaxLoadingPanel1">
    </telerik:RadAjaxLoadingPanel>
   <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
        <script type="text/javascript" src="scripts.js"></script>
    </telerik:RadScriptBlock>
    <asp:SqlDataSource ID="AppointmentsDataSource" runat="server" ProviderName="System.Data.SqlClient" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString35 %>"
        SelectCommand="SELECT * FROM [Appointments_ResourceAvailability]" InsertCommand="INSERT INTO [Appointments_ResourceAvailability] ([Subject], [Start], [End], [RoomID], [UserID]) VALUES (@Subject, @Start, @End , @RoomID, @UserID)"
        UpdateCommand="UPDATE [Appointments_ResourceAvailability] SET [Subject] = @Subject, [Start] = @Start, [End] = @End, [RoomID] = @RoomID, [UserID] = @UserID WHERE (ID = @ID)"
        DeleteCommand="DELETE FROM [Appointments_ResourceAvailability] WHERE [ID] = @ID">
        <DeleteParameters>
            <asp:Parameter Name="ID" Type="Int32"></asp:Parameter>
        </DeleteParameters>
        <UpdateParameters>
            <asp:Parameter Name="ID" Type="Int32"></asp:Parameter>
            <asp:Parameter Name="Subject" Type="String"></asp:Parameter>
            <asp:Parameter Name="Start" Type="DateTime"></asp:Parameter>
            <asp:Parameter Name="End" Type="DateTime"></asp:Parameter>
            <asp:Parameter Name="RoomID" Type="Int32"></asp:Parameter>
            <asp:Parameter Name="UserID" Type="Int32"></asp:Parameter>
        </UpdateParameters>
        <InsertParameters>
            <asp:Parameter Name="Subject" Type="String"></asp:Parameter>
            <asp:Parameter Name="Start" Type="DateTime"></asp:Parameter>
            <asp:Parameter Name="End" Type="DateTime"></asp:Parameter>
            <asp:Parameter Name="RoomID" Type="Int32"></asp:Parameter>
            <asp:Parameter Name="UserID" Type="Int32"></asp:Parameter>
        </InsertParameters>
    </asp:SqlDataSource>
    <asp:SqlDataSource ID="RoomsDataSource" runat="server" 
        ProviderName="System.Data.SqlClient" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString35 %>"
        SelectCommand="SELECT * FROM [Rooms]">
    </asp:SqlDataSource>
    <asp:SqlDataSource ID="UsersDataSource" runat="server" 
        ProviderName="System.Data.SqlClient" ConnectionString="<%$ ConnectionStrings:TelerikConnectionString35 %>"
        SelectCommand="SELECT * FROM [Users]">
    </asp:SqlDataSource>
      <div class="demo-container no-bg">
        <telerik:RadScheduler RenderMode="Lightweight" runat="server" ID="RadScheduler1" SelectedDate="2012-04-16"
            DayStartTime="08:00:00" DayEndTime="18:00:00" DataSourceID="AppointmentsDataSource"
            DataKeyField="ID" DataSubjectField="Subject" DataStartField="Start" DataEndField="End"
            OnAppointmentCreated="RadScheduler1_AppointmentCreated"
            GroupBy="Room" StartEditingInAdvancedForm="false" OnClientAppointmentInserting="onAppointmentInserting"
            OnClientAppointmentMoving="onAppointmentMoving" OnClientAppointmentMoveEnd="onAppointmentMoveEnd"
            OnClientAppointmentResizing="onAppointmentResizing" OnClientAppointmentResizeEnd="onAppointmentResizeEnd">
            <AdvancedForm Modal="true"></AdvancedForm>
            <TimelineView UserSelectable="false"></TimelineView>
            <WeekView UserSelectable="true"></WeekView>
            <MonthView UserSelectable="false"></MonthView>
            <DayView UserSelectable="true"></DayView>
            <ResourceTypes>
                <telerik:ResourceType KeyField="ID" Name="Room" TextField="RoomName" ForeignKeyField="RoomID"
                    DataSourceID="RoomsDataSource"></telerik:ResourceType>
                <telerik:ResourceType KeyField="ID" Name="User" TextField="UserName" ForeignKeyField="UserID"
                    DataSourceID="UsersDataSource"></telerik:ResourceType>
            </ResourceTypes>
            <ResourceStyles>
                <telerik:ResourceStyleMapping Type="User" Text="Alex" ApplyCssClass="rsCategoryBlue">
                </telerik:ResourceStyleMapping>
                <telerik:ResourceStyleMapping Type="User" Text="Bob" ApplyCssClass="rsCategoryOrange">
                </telerik:ResourceStyleMapping>
                <telerik:ResourceStyleMapping Type="User" Text="Charlie" ApplyCssClass="rsCategoryGreen">
                </telerik:ResourceStyleMapping>
            </ResourceStyles>
            <AppointmentTemplate>
                <%# Eval("Subject") %>
                <br />
                <asp:Label runat="server" ID="AssignedTo"></asp:Label>
            </AppointmentTemplate>
            <InlineInsertTemplate>
                <asp:RequiredFieldValidator runat="server" ID="rfvSubject" ErrorMessage="*" ForeColor="Red" Display="Dynamic" ControlToValidate="SubjectTextBox" ValidationGroup="Subject"></asp:RequiredFieldValidator>
                <telerik:RadTextBox runat="server" ID="SubjectTextBox" Text='<%# Bind("Subject") %>' Width="97%"></telerik:RadTextBox>
                <div class="UserToolbox">
                    User:&nbsp;
                    <telerik:RadComboBox RenderMode="Lightweight" runat="server" ID="UsersComboBox" DataTextField="Text" DataValueField="Key"
                        Width="120px" SelectedValue='<%# Bind("UserID") %>' DataSource="<%# GetAvailableUsers(Container) %>">
                    </telerik:RadComboBox>
                    &nbsp;
                    <asp:LinkButton runat="server" ID="InsertLinkButton" CommandName="Insert" Text="Insert" ValidationGroup="Subject"></asp:LinkButton>&nbsp;
                    <asp:LinkButton runat="server" ID="CancelLinkButton" CommandName="Cancel" Text="Cancel"></asp:LinkButton>
                </div>
            </InlineInsertTemplate>
            <InlineEditTemplate>
                <asp:RequiredFieldValidator runat="server" ID="rfvSubject" ErrorMessage="*" ForeColor="Red" Display="Dynamic" 
                    ControlToValidate="SubjectTextBox" ValidationGroup="Subject"></asp:RequiredFieldValidator>
                <telerik:RadTextBox runat="server" ID="SubjectTextBox" Text='<%# Bind("Subject") %>' Width="97%"></telerik:RadTextBox>
                <div class="UserToolbox">
                    User:&nbsp;
                    <telerik:RadComboBox RenderMode="Lightweight" runat="server" ID="UsersComboBox" DataTextField="Text" DataValueField="Key"
                        Width="120px" SelectedValue='<%# Bind("UserID") %>' DataSource="<%# GetAvailableUsers(Container) %>">
                    </telerik:RadComboBox>
                    &nbsp;
                    <asp:LinkButton runat="server" ID="UpdateLinkButton" CommandName="Update" Text="Update" ValidationGroup="Subject"></asp:LinkButton>&nbsp;
                    <asp:LinkButton runat="server" ID="CancelLinkButton" CommandName="Cancel" Text="Cancel"></asp:LinkButton>
                </div>
            </InlineEditTemplate>
            <TimeSlotContextMenuSettings EnableDefault="true"></TimeSlotContextMenuSettings>
            <AppointmentContextMenuSettings EnableDefault="true"></AppointmentContextMenuSettings>
        </telerik:RadScheduler>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance