I'm getting an error printed in the console and my appointment is not appearing
VM1937:17 Uncaught TypeError: Cannot read property 'offsetLeft' of undefined
at a (http://cdn.syncfusion.com/15.1.0.37/js/web/ej.web.all.min.js:10:3375263)
at Object._highlightCurrentTime (http://cdn.syncfusion.com/15.1.0.37/js/web/ej.web.all.min.js:10:3375743)
at Object._renderCommon (http://cdn.syncfusion.com/15.1.0.37/js/web/ej.web.all.min.js:10:3418855)
at Object._renderInitSchedule (http://cdn.syncfusion.com/15.1.0.37/js/web/ej.web.all.min.js:10:3415089)
at Object._init (http://cdn.syncfusion.com/15.1.0.37/js/web/ej.web.all.min.js:10:3290763)
at new <anonymous> (http://cdn.syncfusion.com/15.1.0.37/js/web/ej.web.all.min.js:10:21539)
at n.fn.init.n.fn.(anonymous function) [as ejSchedule] (http://cdn.syncfusion.com/15.1.0.37/js/web/ej.web.all.min.js:10:22796)
at HTMLDocument.<anonymous> (<anonymous>:17:29)
at j (http://cdn.syncfusion.com/js/assets/external/jquery-2.1.4.min.js:2:26925)
at Object.fireWith [as resolveWith] (http://cdn.syncfusion.com/js/assets/external/jquery-2.1.4.min.js:2:27738)
My datasource has times in UTC
I'm trying to display them in my timezone: Sydney, Australia UTC +10 (+ 1 DST)
My computer time is the same as above
Here's a simple example where I can repeat the error:
<body>
<div class="content-container-fluid">
<div class="row">
<div class="cols-sample-area">
<div id="Schedule1"></div>
</div>
</div>
</div>
<script type="text/javascript">
$(function () {
var AppointmentList = [
{
Id: 1230,
Subject: "Appointment1",
AllDay: false,
StartTime: new Date("2017-10-02T02:30:00Z"),
STZ: "UTC +11:00",
EndTime: new Date("2017-10-02T03:30:00Z"),
ETZ: "UTC +11:00"
}
];
$("#Schedule1").ejSchedule({
prioritySettings: { enable: true },
appointmentSettings: {
dataSource: AppointmentList,
id: "Id",
startTime: "StartTime",
endTime: "EndTime",
subject: "Subject",
startTimeZone: "STZ",
endTimeZone: "ETZ"
}
});
});
</script>
</body>
