Timeline Scheduler Appointment alignment off in IE

2 posts, 0 answers
  1. Jonathan
    Jonathan avatar
    37 posts
    Member since:
    Sep 2012

    Posted 08 Mar 2013 Link to this post

    When using the Scheduler in Chrome the alignment is good. See image: goodChrome.jpg
    When viewing the same schedule in IE 9.0.8112.16421 - the alignment of the appointments is off more the farther you scroll to the right. See image: misalignedIE.jpg

    In the sample there are 48 timeslots of 30 minutes each to present a 24 hour day starting at 5:00 am. 

    In a second sample I am now also attaching showing the 24 hours in a much more compressed format and again IE is misaligned. (see images goodChrome2 and misalignedIE2)

    I am using version 2012.3.1016.40.

    The scheduler definition is:
    <telerik:RadScheduler ID="ScheduleResources" runat="server"
        SelectedView="DayView"
        Width="1075px"
        ColumnWidth="300px"
        RowHeight="30px"
        OverflowBehavior="Expand"
        ShowAllDayRow="false"
        NumberOfHoveredRows="1"
        DayStartTime="00:00:00"     
        DayEndTime="23:59:59"
        WorkDayStartTime="09:00:00"
        WorkDayEndTime="17:00:00"
        DisplayRecurrenceActionDialogOnMove="true"
        EnableExactTimeRendering="true"
        ShowFooter="false"
        ShowFullTime="false"
        DataKeyField="ID"
        DataRecurrenceField="recurrenceRule"
        DataRecurrenceParentKeyField="recurrenceParentID"
        DataSourceID="data_appointments"
        DataStartField="startTime"
        DataEndField="endTime"
        DataSubjectField="resourceTitle"
        CustomAttributeNames="resourceCaptionShort, usr_firstname, usr_lastname, resourceID, isSponsor, recurrenceRule"
        OnAppointmentDataBound="Scheduler_AppointmentDataBound"
        OnAppointmentDelete="Scheduler_AppointmentDelete"
        OnAppointmentUpdate="Scheduler_AppointmentUpdate"
        OnAppointmentInsert="Scheduler_AppointmentInsert"
        OnAppointmentCreated="Scheduler_AppointmentCreated"
        OnNavigationComplete="Scheduler_NavigationComplete"
        OnPreRender="Schedule_PreRender"
        OnTimeSlotCreated="Schedule_TimeSlotCreated"
        DataDescriptionField="resourceCaptionShort"
        EnableDescriptionField="True"
        AllowInsert="false" EnableResourceEditing="false"
        EnableAdvancedForm="false" StartEditingInAdvancedForm="false"
        FirstDayOfWeek="Monday" LastDayOfWeek="Sunday"
        GroupingDirection="Horizontal" GroupBy="Flow"
        ReadOnly="true"
         WeekView-HeaderDateFormat="g" TimelineView-HeaderDateFormat="g" >
        <TimelineView StartTime="05:00:00"
            ColumnHeaderDateFormat="h:mm tt"
            NumberOfSlots="48"
            SlotDuration="00:30:00"
            TimeLabelSpan="1"
            UserSelectable="true"
            GroupingDirection="Vertical" GroupBy="Flow" />
        <TimeSlotContextMenuSettings EnableDefault="false" />
        <DayView  GroupingDirection="Horizontal" DayStartTime="0:00:00" DayEndTime="23:59:59" GroupBy="Flow" UserSelectable="true"  />
        <WeekView GroupingDirection="Horizontal" DayStartTime="0:00:00" DayEndTime="23:59:59" GroupBy="Flow" />
        <Localization
            AdvancedSubjectRequired="Please provide resource schedule subject"
            AdvancedNewAppointment="New Resource Schedule"
            AdvancedEditAppointment="Edit Resource Schedule"
            ConfirmRecurrenceEditTitle="Editing a recurring resource schedule"
            ConfirmRecurrenceResizeTitle="Resizing a recurring resource schedule"
            ConfirmRecurrenceDeleteTitle="Deleting a recurring resource schedule"
            ConfirmDeleteText="Are you sure you want to delete this resource schedule?"
            ConfirmRecurrenceMoveTitle="Moving a recurring resource schedule"
            ContextMenuAddAppointment="New Resource Schedule"
            ContextMenuAddRecurringAppointment="New Recurring Resource Schedule">
        </Localization>
     
        <AppointmentContextMenuSettings EnableDefault="false" />
        <AdvancedForm EnableResourceEditing="False" Modal="False" Enabled="False" />
        <ResourceTypes>
            <telerik:ResourceType KeyField="ID" Name="Flow" TextField="resourceType" ForeignKeyField="resourceTypeID" DataSourceID="data_resources" />
        </ResourceTypes>
        <AppointmentContextMenus>
            <telerik:RadSchedulerContextMenu ID="RadSchedulerContextMenu1" runat="server" Enabled="false" Visible="false">
                <Items>
                    <telerik:RadMenuItem runat="server" Text="Edit Schedule" Value="schedule">
                    </telerik:RadMenuItem>
                </Items>
            </telerik:RadSchedulerContextMenu>
        </AppointmentContextMenus>
    </telerik:RadScheduler>

  2. Boyan Dimitrov
    Admin
    Boyan Dimitrov avatar
    2062 posts

    Posted 13 Mar 2013 Link to this post

    Hello,

    Since I was not able to reproduce the provided issue at my side, could you please clarify whether you have any custom styles on your page? I have attached a simplified page that includes the provided markup code of your RadScheduler control. Please let me know if something is different with your scenario.
    Additionally here you can watch a video of that project behavior at my side.


    Kind regards,
    Boyan Dimitrov
    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.
Back to Top