Hello everyone,
I've downloaded the RadControls for ASP.NET AJAX and I am trying to use them in a MVC application. I'm especially interested on using
the RadScheduler control but I am having a hard time figuring out how to interact with it using AJAX/Json.
I am wondering if someone has some example of how could I bind/edit the Appointments or some other action within the Scheduler.
Thank you all!
Namaste
I've downloaded the RadControls for ASP.NET AJAX and I am trying to use them in a MVC application. I'm especially interested on using
the RadScheduler control but I am having a hard time figuring out how to interact with it using AJAX/Json.
I am wondering if someone has some example of how could I bind/edit the Appointments or some other action within the Scheduler.
Thank you all!
Namaste
6 Answers, 1 is accepted
0
Hello Andre,
We do not support RadScheduler in ASP.NET MVC application, because it is tightly related with WebForms paradigm. Please review this blog post for more information about RadControls in ASP.NET MVC.
Nevertheless I will suggest review our Telerik Extensions for ASP.NET MVC.
Greetings,
Georgi Krustev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
We do not support RadScheduler in ASP.NET MVC application, because it is tightly related with WebForms paradigm. Please review this blog post for more information about RadControls in ASP.NET MVC.
Nevertheless I will suggest review our Telerik Extensions for ASP.NET MVC.
Greetings,
Georgi Krustev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Hello Andre,
Actually you can use RadScheduler within an ASP.NET MVC application, but you have to use WebServices for loading/updating appointments as the non-WebService approach relies on Webforms' postbacks.
I am attaching a sample project that shows how to use RadScheduler's WebService mode in MVC.
Please excuse us for the initially misleading information.
Namaste,
Dimitar Milushev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
Actually you can use RadScheduler within an ASP.NET MVC application, but you have to use WebServices for loading/updating appointments as the non-WebService approach relies on Webforms' postbacks.
I am attaching a sample project that shows how to use RadScheduler's WebService mode in MVC.
Please excuse us for the initially misleading information.
Namaste,
Dimitar Milushev
the Telerik team
Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
Whitney
Top achievements
Rank 1
answered on 21 Nov 2011, 10:20 PM
Is there an example of RadScheduler in an MVC 3 application using Razor? I tried the converter tool and all references to the RadScheduler control were dropped in the conversion.
0
Hello Whitney,
To get an expert advice on MVC, please post your questions in our MVC forums - http://www.telerik.com/community/forums/aspnet-mvc.aspx.
All the best,
Peter
the Telerik team
To get an expert advice on MVC, please post your questions in our MVC forums - http://www.telerik.com/community/forums/aspnet-mvc.aspx.
All the best,
Peter
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Nilesh
Top achievements
Rank 1
answered on 11 Apr 2013, 06:42 AM
Hi , I am new in MVC.I want to user radschedular(as partial control) in mvc3 with razor.but ,when i click on radscheduler calender its call whole view postback.so my view render again with clear value.so could you give me any idea for update only partial view with out postback on its date change event?
my code for partil view
Schedular.ASPX
<script runat="server">
//needed to run RadScheduler without <form> tag
private const string AppointmentsKey = "Telerik.Web.Examples.Scheduler.BindToList.CS.Apts";
private List<AppointmentInfo> Appointments
{
get
{
List<AppointmentInfo> sessApts = Session[AppointmentsKey] as List<AppointmentInfo>;
if (sessApts == null)
{
sessApts = new List<AppointmentInfo>();
Session[AppointmentsKey] = sessApts;
}
return sessApts;
}
}
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
if (!IsPostBack)
{
Session.Remove(AppointmentsKey);
InitializeResources();
InitializeAppointments();
}
RadScheduler1.DataSource = Appointments;
}
public void RadScheduler1_AppointmentInsert(object sender, SchedulerCancelEventArgs e)
{
Appointments.Add(new AppointmentInfo(e.Appointment));
}
public void RadScheduler1_AppointmentUpdate(object sender, AppointmentUpdateEventArgs e)
{
AppointmentInfo ai = FindById(e.ModifiedAppointment.ID);
ai.CopyInfo(e.ModifiedAppointment);
}
protected void RadScheduler1_AppointmentDelete(object sender, SchedulerCancelEventArgs e)
{
Appointments.Remove(FindById(e.Appointment.ID));
}
private void InitializeResources()
{
ResourceType resType = new ResourceType();
resType.ForeignKeyField = "ID";
RoomBooking.Controllers.SchedulerServiceController obj = new RoomBooking.Controllers.SchedulerServiceController();
resType.DataSource = obj.GetRoom();
resType.KeyField = "ID";
resType.Name = "resourceRoom";
resType.TextField = "RoomName";
RadScheduler1.ResourceTypes.Add(resType);
}
protected void RadScheduler1_AppointmentCommand(object sender, Telerik.Web.UI.AppointmentCommandEventArgs e)
{
}
private void InitializeAppointments()
{
RoomBooking.Controllers.CreateBookingController obj = new RoomBooking.Controllers.CreateBookingController();
List<RoomBooking.Proxy.CRBooking> list = obj.GetCrBookingByDate(RadScheduler1.SelectedDate.Date, RadScheduler1.SelectedDate.Date);
if (list.Count > 0)
foreach (RoomBooking.Proxy.CRBooking eachobj in list)
{
Appointments.Add(new AppointmentInfo(eachobj.HostName, Convert.ToDateTime(eachobj.StartTime.ToString("dd-MM-yyyy HH:mm")), Convert.ToDateTime(eachobj.EndTime.ToString("dd-MM-yyyy HH:mm")), string.Empty, null, string.Empty, 1, eachobj.Room));
}
}
private AppointmentInfo FindById(object ID)
{
foreach (AppointmentInfo ai in Appointments)
{
if (ai.ID.Equals(ID))
{
return ai;
}
}
return null;
}
//public override void VerifyRenderingInServerForm(Control control)
//{
//}
protected void RadScheduler1_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
}
}
protected void RadScheduler1_AppointmentCreated(object sender, AppointmentCreatedEventArgs e)
{
}
protected void ButtonClick_Event(object sender, ImageClickEventArgs e)
{
// RadScheduler1.ExportToPdf();
}
protected void Calender_Click(object sender, ImageClickEventArgs e)
{
WriteCalendar(RadScheduler.ExportToICalendar(RadScheduler1.Appointments));
}
private void WriteCalendar(string data)
{
HttpResponse response = Page.Response;
response.Clear();
response.Buffer = true;
response.ContentType = "text/calendar";
response.ContentEncoding = Encoding.UTF8;
response.Charset = "utf-8";
response.AddHeader("Content-Disposition", "attachment;filename=\"RadSchedulerExport.ics\"");
response.Write(data);
response.End();
}
protected void RadScheduler1_NavigationCommand(object sender, SchedulerNavigationCommandEventArgs e)
{
}
</script>
<script runat="server">
//needed to run RadScheduler without <form> tag
public override void VerifyRenderingInServerForm(Control control)
{
//base.VerifyRenderingInServerForm(control);
}
</script>
<%--<form id="SchedulerForm" runat="server">--%>
<form runat="server" >
<div id="tabledata" >
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadAjaxLoadingPanel runat="Server" ID="RadAjaxLoadingPanel1">
</telerik:RadAjaxLoadingPanel>
<telerik:RadAjaxManager ID="RadAjaxManager" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadScheduler1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadScheduler1" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<asp:imagebutton id="ImageButton1" runat="Server" height="30" width="30" imageurl="~/Images/Pdf.png"
onclick="ButtonClick_Event" alternatetext="Export to PDF" tooltip="Export to PDF">
</asp:imagebutton>
<asp:imagebutton runat="server" id="Button2" height="30" width="30" imageurl="~/Images/Outlook.png"
alternatetext="Export All to iCalendar" tooltip="Export All to iCalendar" onclick="Calender_Click">
</asp:imagebutton>
<telerik:RadScheduler runat="server" ID="RadScheduler1" DayStartTime="07:00:00" SelectedView="TimelineView"
ClientIDMode="Static" TimelineView-SlotDuration="01:00:00" OnAppointmentInsert="RadScheduler1_AppointmentInsert"
TimelineView-NumberOfSlots="17" OnAppointmentUpdate="RadScheduler1_AppointmentUpdate"
OnAppointmentDelete="RadScheduler1_AppointmentDelete" DataKeyField="ID" DataSubjectField="Subject"
DataStartField="Start" DataEndField="End" DataRecurrenceField="RecurrenceRule"
DataRecurrenceParentKeyField="RecurrenceParentId" DataReminderField="Reminder"
OnAppointmentCommand="RadScheduler1_AppointmentCommand" TimeLabelRowSpan="1"
TimelineView-StartTime="07:00:00" TimelineView-GroupingDirection="Vertical" TimelineView-ColumnHeaderDateFormat="HH:mm"
TimelineView-DayEndTime="23:00:00" OnLoad="RadScheduler1_Load" EnableAdvancedForm="false"
OnAppointmentCreated="RadScheduler1_AppointmentCreated" OnNavigationCommand="RadScheduler1_NavigationCommand">
<AdvancedForm Modal="false"></AdvancedForm>
<TimelineView UserSelectable="true" GroupBy="resourceRoom" GroupingDirection="Vertical">
</TimelineView>
<MultiDayView UserSelectable="false"></MultiDayView>
<DayView UserSelectable="false"></DayView>
<WeekView UserSelectable="false"></WeekView>
<MonthView UserSelectable="false"></MonthView>
<TimeSlotContextMenuSettings EnableDefault="true"></TimeSlotContextMenuSettings>
<AppointmentContextMenuSettings EnableDefault="true"></AppointmentContextMenuSettings>
<TimeSlotContextMenus>
<telerik:RadSchedulerContextMenu runat="server" ID="SchedulerTimeSlotContextMenu">
<Items>
<telerik:RadMenuItem Text="New Appointment" Value="CommandAddAppointment">
</telerik:RadMenuItem>
<telerik:RadMenuItem Text="Go to today" Value="CommandGoToToday">
</telerik:RadMenuItem>
</Items>
</telerik:RadSchedulerContextMenu>
</TimeSlotContextMenus>
</telerik:RadScheduler>
</div>
</form>
Code for View:
<div id="div2">
@*@Html.Partial("Schedular")*@;
</div>
my code for partil view
Schedular.ASPX
<script runat="server">
//needed to run RadScheduler without <form> tag
private const string AppointmentsKey = "Telerik.Web.Examples.Scheduler.BindToList.CS.Apts";
private List<AppointmentInfo> Appointments
{
get
{
List<AppointmentInfo> sessApts = Session[AppointmentsKey] as List<AppointmentInfo>;
if (sessApts == null)
{
sessApts = new List<AppointmentInfo>();
Session[AppointmentsKey] = sessApts;
}
return sessApts;
}
}
protected override void OnInit(EventArgs e)
{
base.OnInit(e);
if (!IsPostBack)
{
Session.Remove(AppointmentsKey);
InitializeResources();
InitializeAppointments();
}
RadScheduler1.DataSource = Appointments;
}
public void RadScheduler1_AppointmentInsert(object sender, SchedulerCancelEventArgs e)
{
Appointments.Add(new AppointmentInfo(e.Appointment));
}
public void RadScheduler1_AppointmentUpdate(object sender, AppointmentUpdateEventArgs e)
{
AppointmentInfo ai = FindById(e.ModifiedAppointment.ID);
ai.CopyInfo(e.ModifiedAppointment);
}
protected void RadScheduler1_AppointmentDelete(object sender, SchedulerCancelEventArgs e)
{
Appointments.Remove(FindById(e.Appointment.ID));
}
private void InitializeResources()
{
ResourceType resType = new ResourceType();
resType.ForeignKeyField = "ID";
RoomBooking.Controllers.SchedulerServiceController obj = new RoomBooking.Controllers.SchedulerServiceController();
resType.DataSource = obj.GetRoom();
resType.KeyField = "ID";
resType.Name = "resourceRoom";
resType.TextField = "RoomName";
RadScheduler1.ResourceTypes.Add(resType);
}
protected void RadScheduler1_AppointmentCommand(object sender, Telerik.Web.UI.AppointmentCommandEventArgs e)
{
}
private void InitializeAppointments()
{
RoomBooking.Controllers.CreateBookingController obj = new RoomBooking.Controllers.CreateBookingController();
List<RoomBooking.Proxy.CRBooking> list = obj.GetCrBookingByDate(RadScheduler1.SelectedDate.Date, RadScheduler1.SelectedDate.Date);
if (list.Count > 0)
foreach (RoomBooking.Proxy.CRBooking eachobj in list)
{
Appointments.Add(new AppointmentInfo(eachobj.HostName, Convert.ToDateTime(eachobj.StartTime.ToString("dd-MM-yyyy HH:mm")), Convert.ToDateTime(eachobj.EndTime.ToString("dd-MM-yyyy HH:mm")), string.Empty, null, string.Empty, 1, eachobj.Room));
}
}
private AppointmentInfo FindById(object ID)
{
foreach (AppointmentInfo ai in Appointments)
{
if (ai.ID.Equals(ID))
{
return ai;
}
}
return null;
}
//public override void VerifyRenderingInServerForm(Control control)
//{
//}
protected void RadScheduler1_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
}
}
protected void RadScheduler1_AppointmentCreated(object sender, AppointmentCreatedEventArgs e)
{
}
protected void ButtonClick_Event(object sender, ImageClickEventArgs e)
{
// RadScheduler1.ExportToPdf();
}
protected void Calender_Click(object sender, ImageClickEventArgs e)
{
WriteCalendar(RadScheduler.ExportToICalendar(RadScheduler1.Appointments));
}
private void WriteCalendar(string data)
{
HttpResponse response = Page.Response;
response.Clear();
response.Buffer = true;
response.ContentType = "text/calendar";
response.ContentEncoding = Encoding.UTF8;
response.Charset = "utf-8";
response.AddHeader("Content-Disposition", "attachment;filename=\"RadSchedulerExport.ics\"");
response.Write(data);
response.End();
}
protected void RadScheduler1_NavigationCommand(object sender, SchedulerNavigationCommandEventArgs e)
{
}
</script>
<script runat="server">
//needed to run RadScheduler without <form> tag
public override void VerifyRenderingInServerForm(Control control)
{
//base.VerifyRenderingInServerForm(control);
}
</script>
<%--<form id="SchedulerForm" runat="server">--%>
<form runat="server" >
<div id="tabledata" >
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadAjaxLoadingPanel runat="Server" ID="RadAjaxLoadingPanel1">
</telerik:RadAjaxLoadingPanel>
<telerik:RadAjaxManager ID="RadAjaxManager" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadScheduler1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadScheduler1" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<asp:imagebutton id="ImageButton1" runat="Server" height="30" width="30" imageurl="~/Images/Pdf.png"
onclick="ButtonClick_Event" alternatetext="Export to PDF" tooltip="Export to PDF">
</asp:imagebutton>
<asp:imagebutton runat="server" id="Button2" height="30" width="30" imageurl="~/Images/Outlook.png"
alternatetext="Export All to iCalendar" tooltip="Export All to iCalendar" onclick="Calender_Click">
</asp:imagebutton>
<telerik:RadScheduler runat="server" ID="RadScheduler1" DayStartTime="07:00:00" SelectedView="TimelineView"
ClientIDMode="Static" TimelineView-SlotDuration="01:00:00" OnAppointmentInsert="RadScheduler1_AppointmentInsert"
TimelineView-NumberOfSlots="17" OnAppointmentUpdate="RadScheduler1_AppointmentUpdate"
OnAppointmentDelete="RadScheduler1_AppointmentDelete" DataKeyField="ID" DataSubjectField="Subject"
DataStartField="Start" DataEndField="End" DataRecurrenceField="RecurrenceRule"
DataRecurrenceParentKeyField="RecurrenceParentId" DataReminderField="Reminder"
OnAppointmentCommand="RadScheduler1_AppointmentCommand" TimeLabelRowSpan="1"
TimelineView-StartTime="07:00:00" TimelineView-GroupingDirection="Vertical" TimelineView-ColumnHeaderDateFormat="HH:mm"
TimelineView-DayEndTime="23:00:00" OnLoad="RadScheduler1_Load" EnableAdvancedForm="false"
OnAppointmentCreated="RadScheduler1_AppointmentCreated" OnNavigationCommand="RadScheduler1_NavigationCommand">
<AdvancedForm Modal="false"></AdvancedForm>
<TimelineView UserSelectable="true" GroupBy="resourceRoom" GroupingDirection="Vertical">
</TimelineView>
<MultiDayView UserSelectable="false"></MultiDayView>
<DayView UserSelectable="false"></DayView>
<WeekView UserSelectable="false"></WeekView>
<MonthView UserSelectable="false"></MonthView>
<TimeSlotContextMenuSettings EnableDefault="true"></TimeSlotContextMenuSettings>
<AppointmentContextMenuSettings EnableDefault="true"></AppointmentContextMenuSettings>
<TimeSlotContextMenus>
<telerik:RadSchedulerContextMenu runat="server" ID="SchedulerTimeSlotContextMenu">
<Items>
<telerik:RadMenuItem Text="New Appointment" Value="CommandAddAppointment">
</telerik:RadMenuItem>
<telerik:RadMenuItem Text="Go to today" Value="CommandGoToToday">
</telerik:RadMenuItem>
</Items>
</telerik:RadSchedulerContextMenu>
</TimeSlotContextMenus>
</telerik:RadScheduler>
</div>
</form>
Code for View:
<div id="div2">
@*@Html.Partial("Schedular")*@;
</div>
0
Hello Nilesh,
Plamen
the Telerik team
If you want to use ASP .NET AJAX RadScheduler in a MVC application it should be bound to Web Service or as in the sample provided here.
Hope this information will be helpful.
Plamen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.