Scheduler - Client-side API

  • today
April, 2012
April, 2012
SMTWTFS
       
1234567
891011121314
15161718192021
22232425262728
2930     
Monday, April 16, 2012
all day
8AM
 
9AM
 
10AM
 
11AM
 
12PM
 
1PM
 
2PM
 
3PM
 
4PM
 
5PM
 
Walk the dog
Call the car service
Pick up the kids from school
Laundry
Show 24 hours...
  • Edit
  • Delete
  • New Appointment
  • Go to today
  • Show 24 hours...
Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

This example demonstrates how to use RadScheduler's client-side API to implement a custom confirmation message with RadWindow.

A confirmation window will appear when you have overlapping appointments after move or resize. This behavior is useful in scenarios where having two appointments in the same time frame is not advisable, but still allowed. Using RadScheduler's client-side API, developers can invoke the same operations that are available through user interaction:

  • Scheduler.showInsertFormAt(timeSlot) - Shows the in-line insert form, similar to the user double-clicking the slot.
  • Scheduler.insertAppointment(newAppointment) - Directly inserts a new appointment in RadScheduler. All of the associated server-side events are fired.
  • Scheduler.updateAppointment(appointment, editSeries) - Updates an existing appointment.
  • Scheduler.deleteAppointment(appointment, deleteSeries) - Deletes an existing appointment.
  • Scheduler.editAppointment(appointment, editSeries) - Opens the advanced edit form to edit the appointment. Similar to double-click an appointment.
  • DefaultCS.aspx
  • scripts.js
  • styles.css
<%@ Page Language="C#" AutoEventWireup="true"  %>

<%@ Register TagPrefix="sds" Namespace="Telerik.Web.SessionDS" %>
<%@ 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 rel="Stylesheet" type="text/css" href="styles.css" />
    <script src="scripts.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container no-bg">
        <telerik:RadWindowManager RenderMode="Lightweight" ID="Singleton" runat="server">
        </telerik:RadWindowManager>
        <telerik:RadAjaxPanel runat="server" ID="RadAjaxPanel1">
            <telerik:RadScheduler RenderMode="Lightweight" runat="server" ID="RadScheduler1" ShowViewTabs="false" SelectedDate="2012-04-16"
                OnClientAppointmentInserting="appointmentInserting" DataSourceID="AppointmentsDataSource"
                OnClientAppointmentResizeEnd="appointmentResizeEnd" OnClientAppointmentMoveEnd="appointmentMoveEnd"
                DataKeyField="ID" DataSubjectField="Subject" DataStartField="Start" DataEndField="End"
                OnClientAppointmentMoveStart="OnClientAppointmentMoveStart" OnClientAppointmentResizeStart="OnClientAppointmentResizeStart"
                DataRecurrenceField="RecurrenceRule" DataRecurrenceParentKeyField="RecurrenceParentID" EnableAdvancedForm="false">
                <TimeSlotContextMenuSettings EnableDefault="true"></TimeSlotContextMenuSettings>
                <AppointmentContextMenuSettings EnableDefault="true"></AppointmentContextMenuSettings>
            </telerik:RadScheduler>
        </telerik:RadAjaxPanel>
    </div>
    <asp:SqlDataSource ID="AppointmentsDataSource" runat="server"
        ConnectionString="<%$ ConnectionStrings:TelerikConnectionString35 %>"
        SelectCommand="SELECT * FROM [ConfirmDialog_Appointments] WHERE ([Duration] IS NULL)"
        InsertCommand="INSERT INTO [ConfirmDialog_Appointments] ([Subject], [Start], [End], [RecurrenceRule], [RecurrenceParentID], [Duration]) VALUES (@Subject, @Start, @End, @RecurrenceRule, @RecurrenceParentID, @Duration)"
        UpdateCommand="UPDATE [ConfirmDialog_Appointments] SET [Subject] = @Subject, [Start] = @Start, [End] = @End, [RecurrenceRule] = @RecurrenceRule, [RecurrenceParentID] = @RecurrenceParentID, [Duration] = @Duration WHERE [ID] = @ID"
        DeleteCommand="DELETE FROM [ConfirmDialog_Appointments] WHERE [ID] = @ID">
        <DeleteParameters>
            <asp:Parameter Name="ID" Type="Int32"></asp:Parameter>
        </DeleteParameters>
        <UpdateParameters>
            <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="RecurrenceRule" Type="String"></asp:Parameter>
            <asp:Parameter Name="RecurrenceParentID" Type="Int32"></asp:Parameter>
            <asp:Parameter Name="Duration" Type="Int32"></asp:Parameter>
            <asp:Parameter Name="ID" 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="RecurrenceRule" Type="String"></asp:Parameter>
            <asp:Parameter Name="RecurrenceParentID" Type="Int32"></asp:Parameter>
            <asp:Parameter Name="Duration" Type="Int32"></asp:Parameter>
        </InsertParameters>
    </asp:SqlDataSource>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?