This is a migrated thread and some comments may be shown as answers.

How to merge RadScheduler timeslots in Timeline view

1 Answer 35 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Meng
Top achievements
Rank 1
Meng asked on 04 Nov 2016, 02:29 PM

Hi There,

Is it possible to merge RadScheduler timeslots in Timeline view? I would like to display the number of appointments over two days. Currently, I managed to do this on one day only. Please see the following example code, I displayed number '7' on Mondays, what I need is to display number '7' over both Mondays and Tuesdays timeslots. Screenshot attached. Any suggestions will be greatly appreciated. Thank you!

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="RadSchedulerTimeLineViewModification.aspx.cs" Inherits="RadSchedulerWebForm" %>
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head id="Head1" runat="server">
    <title>Untitled Page</title>
    <style type="text/css">
        .rsMainHeader
        {
                width: auto !important;
                text-align:Left !important;
                padding-right:5px !important;
        }
        .MySlotGreen
       {
        color: #fff !important;  
        text-align:center !important;
        background-color:#69690a !important;
       }
    </style>
</head>
<body>
    <form id="form1" runat="server">
        <asp:ScriptManager ID="ScriptManager1" runat="server">
        </asp:ScriptManager>
        <div style="width: 980px;">
            <telerik:RadScheduler runat="server" ID="RadScheduler1" SelectedView="TimelineView" ShowViewTabs="false" OnTimeSlotCreated="RadScheduler1_TimeSlotCreated"
            OnNavigationComplete="RadScheduler1_NavigationComplete" ColumnWidth="28" StartInsertingInAdvancedForm="true" AppointmentStyleMode="Default">
                <TimelineView SlotDuration="1" NumberOfSlots="30" GroupBy="User, Month" GroupingDirection="Vertical" ColumnHeaderDateFormat="MMM dd ddd" HeaderDateFormat="MMMM, yyyy"/> 
            </telerik:RadScheduler>
        </div>
    </form>
</body>
</html>

 

Code Behind:

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
using Telerik.Web.UI;
using Telerik.Web.UI.Calendar;
using Telerik.Web.UI.Calendar.View;
 
public partial class RadSchedulerWebForm : System.Web.UI.Page
{
    protected override void OnInit(EventArgs e)
    {
        base.OnInit(e);
        RadScheduler1.Provider = new XmlSchedulerProvider(Server.MapPath("~/App_Data/Appointments.xml"), true);
    }
 
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack & RadScheduler1.SelectedView == SchedulerViewType.TimelineView)
        {
            int year = RadScheduler1.SelectedDate.Year;
            int month = RadScheduler1.SelectedDate.Month;
            int numberOfDaysInCurrentMonth = DateTime.DaysInMonth(year, month);
            RadScheduler1.SelectedDate = new DateTime(year, month, 1);
            RadScheduler1.TimelineView.NumberOfSlots = numberOfDaysInCurrentMonth;
        }
    }
 
    protected void RadScheduler1_NavigationComplete(object sender, SchedulerNavigationCompleteEventArgs e)
    {
        if (RadScheduler1.SelectedView == SchedulerViewType.TimelineView)
        {
            int year = RadScheduler1.SelectedDate.Year;
            int month = RadScheduler1.SelectedDate.Month;
            int numberOfDaysInCurrentMonth = DateTime.DaysInMonth(year, month);
            RadScheduler1.SelectedDate = new DateTime(year, month, 1);
            RadScheduler1.TimelineView.NumberOfSlots = numberOfDaysInCurrentMonth;
        }
    }
 
    protected void RadScheduler1_TimeSlotCreated(object sender, Telerik.Web.UI.TimeSlotCreatedEventArgs e)
    {
        if (RadScheduler1.SelectedView == SchedulerViewType.TimelineView)
        {
            if (e.TimeSlot.Start.Date.DayOfWeek == DayOfWeek.Monday)
            {
                Label numberLabel = new Label();
                numberLabel.Text = "7";
                e.TimeSlot.CssClass = "MySlotGreen";
 
                e.TimeSlot.Control.Controls.Add(numberLabel);
            }
        }
    }
}

 

1 Answer, 1 is accepted

Sort by
0
Accepted
Ivan Danchev
Telerik team
answered on 09 Nov 2016, 12:46 PM
Hello Meng Li,

Merging timeslots is not supported and contradicts the Scheduler's design. For an appointment to be shown over two timeslots, Monday and Tuesday for instance, the appointment must start on Monday and end on Tuesday: screenshot.

Regards,
Ivan Danchev
Telerik by Progress
Check out the new UI for ASP.NET Core, the most complete UI suite for ASP.NET Core development on the market, with 60+ tried-and-tested widgets, based on Kendo UI.
Tags
Scheduler
Asked by
Meng
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Share this question
or