We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

issues with header template

Since version there has been an issue I am having with the header template in the Scheduler.

With scrolling set for the calendar and a header template, when the calendar ends up in a scrolling window the header loses all connection to the calendar and becomes small (see included image)

It doesn't do this in version but it does happen in thru

Below is my call to the calendar and the header template code

Header code 
<script id="hdrTemplate" type="text/x-jsrender">
<div class="hdrR hdrBox" data-day="{{>~formatDay(date)}}" data-date="{{>~formatD(date)}}">{{>~formatDay(date)}}</div>
height: calHt,
allowDragAndDrop: false,
showCurrentTimeIndicator: false,
showAppointmentNavigator: false,
enableAppointmentResize: false,
isDST: true,
showLocationField: false,
showAllDayRow: false,
showTimeScale: false,
showQuickWindow: false,
timeScale: {enable: false},
cellHeight: "21px",
cellWidth: cellWd,
dateFormat: "MM/dd/yyyy",
currentDate: sysUI.currDate,
enablePersistence: false,
enableRecurrenceValidation: false,
firstDayOfWeek: "Monday",
orientation: "horizontal",
views: ["Day","Week"],
currentView: ej.Schedule.CurrentView.Week,
tooltipSettings: {enable: false},
dateHeaderTemplateId: "#hdrTemplate",
appointmentTemplateId: "#apptTemplate",
appointmentSettings: {
dataSource: [],
id: "ID",
title: "title",
subject: "subject",
startTime: "startTime",
endTime: "endTime",
description: "desc",
allDay: "allDay",
location: "location",
resourceFields: "ownerId"
create: 'calLoad',
actionComplete: 'calLoad',
beforeAppointmentRemove: function(args){return false;},
appointmentClick: function(args){return false;},
appointmentWindowOpen: function(args){return false;},
appointmentHover: function(args){return false;},
cellDoubleClick: function(args){return false;},
cellClick: function(args){return false;}

Any help with this would be appreciated. If you need other information please let me know

Attachment: calendar_384a384e.zip

6 Replies

DB David Barrett July 15, 2017 04:23 PM UTC

I've also noticed that if I don't use my own header, or don't specify a cell width then it seems to work ok. Only when I set the cellWidth variable does it seem to trigger this issue

KK Karthigeyan Krishnamurthi Syncfusion Team July 17, 2017 10:18 AM UTC

Hi David  
Thank you for contacting Syncfusion Support.   
The known issue “Misalignment occurs while using header bar template and cell width option together” is internally logged already at our end and the fix will be included in our upcoming Volume 3, 2017 main release which is expected to be rolled out by the end of this month.    

DB David Barrett August 8, 2017 09:15 AM UTC

I downloaded the new Volume 3 version that just came out and this problem still seems to be happening. 

Do you know if there is another fix for it that might work?


KK Karthigeyan Krishnamurthi Syncfusion Team August 9, 2017 09:26 AM UTC

Hi David, 
Thanks for your update. 
We have checked the issue “Misalignment occurs while using header bar template and cell width option together” in latest version and the issue is fixed. We have prepared the sample for the same for your reference which can be viewed from the below link. 
Note: In the above sample, if the source file version is changed to its previous version, issue will occur. 

DB David Barrett August 10, 2017 03:43 PM UTC

My apologies, I found the issue, I had changed it in one place but not another so it was still using the older version. You are correct it has been fixed.


KK Karthigeyan Krishnamurthi Syncfusion Team August 11, 2017 04:39 AM UTC

Hi David,   
We are happy to hear that your issue has been fixed. 


Live Chat Icon For mobile
Up arrow icon