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

SchedulerDataSource altering start/end times to apply timeszone

3 Answers 16 Views
Data Source
This is a migrated thread and some comments may be shown as answers.
Grant
Top achievements
Rank 2
Veteran
Iron
Grant asked on 04 Oct 2016, 12:28 PM

Hi, 

Im creating a SchedulerDataSource using remote data, however the when the SDS gets the responed data its applying (I assume) some kind of timezone logic that is changing the times of the start and end dates. I do not want this, as the times are stored correctly in the Database being read. Please advise on how I can stop this from happening?

CODE:

var timePickerDataSource = new kendo.data.SchedulerDataSource({
  transport: {
    read: {
      data: {
        userId: 1,
        frequencyDays: "1,4,8,11,15,18,22,25"
      },
      dataType: "json",
      type: "GET",
      url: "/itd-boot-thymeleaf-demo/events/forSchedulerTimePicker"
    }
  },
   
  schema: {
    parse: function(e) {
      $(e).each(function(i,e) {
        console.debug("Schema.parse", "Event (Id:"+e.id + ", start: " + e.start + ", end: " + e.end + ")");
      })
      return e;
    }
  }
});
 
timePickerDataSource.fetch(function(){
  $(timePickerDataSource.data()).each(function(idx, event) {
    console.debug("SDS", "Event (Id:"+event.id + ", start: " + event.start + ", end: " + event.end + ")");
  });
});

My Server Response:
[{"id":1,"start":"2016-10-04T07:00:00.000Z","end":"2016-10-04T08:00:00.000Z","title":null,"userId":1,"companyId":1,"appointmentTypeId":1,"locationId":1},{"id":3,"start":"2016-10-04T11:00:00.000Z","end":"2016-10-04T13:00:00.000Z","title":null,"userId":1,"companyId":1,"appointmentTypeId":1,"locationId":1},{"id":6,"start":"2016-10-04T14:00:00.000Z","end":"2016-10-04T15:30:00.000Z","title":null,"userId":1,"companyId":1,"appointmentTypeId":2,"locationId":2},{"id":9,"start":"2016-10-04T12:30:00.000Z","end":"2016-10-04T13:30:00.000Z","title":null,"userId":1,"companyId":1,"appointmentTypeId":1,"locationId":1},{"id":10,"start":"2016-10-04T09:00:00.000Z","end":"2016-10-04T10:00:00.000Z","title":null,"userId":1,"companyId":1,"appointmentTypeId":1,"locationId":1},{"id":11,"start":"2016-10-04T10:30:00.000Z","end":"2016-10-04T11:30:00.000Z","title":null,"userId":1,"companyId":1,"appointmentTypeId":1,"locationId":1}]

schema.parse Results:
Event (Id:1, start: 2016-10-04T07:00:00.000Z, end: 2016-10-04T08:00:00.000Z)
Event (Id:3, start: 2016-10-04T11:00:00.000Z, end: 2016-10-04T13:00:00.000Z)
Event (Id:6, start: 2016-10-04T14:00:00.000Z, end: 2016-10-04T15:30:00.000Z)
Event (Id:9, start: 2016-10-04T12:30:00.000Z, end: 2016-10-04T13:30:00.000Z)
Event (Id:10, start: 2016-10-04T09:00:00.000Z, end: 2016-10-04T10:00:00.000Z)
Event (Id:11, start: 2016-10-04T10:30:00.000Z, end: 2016-10-04T11:30:00.000Z)

timePickerDataSource.fetch() data iteration results:
SDS Event (Id:1, start: Tue Oct 04 2016 09:00:00 GMT+0200 (South Africa Standard Time), end: Tue Oct 04 2016 10:00:00 GMT+0200 (South Africa Standard Time))
SDS Event (Id:3, start: Tue Oct 04 2016 13:00:00 GMT+0200 (South Africa Standard Time), end: Tue Oct 04 2016 15:00:00 GMT+0200 (South Africa Standard Time))
SDS Event (Id:6, start: Tue Oct 04 2016 16:00:00 GMT+0200 (South Africa Standard Time), end: Tue Oct 04 2016 17:30:00 GMT+0200 (South Africa Standard Time))
SDS Event (Id:9, start: Tue Oct 04 2016 14:30:00 GMT+0200 (South Africa Standard Time), end: Tue Oct 04 2016 15:30:00 GMT+0200 (South Africa Standard Time))
SDS Event (Id:10, start: Tue Oct 04 2016 11:00:00 GMT+0200 (South Africa Standard Time), end: Tue Oct 04 2016 12:00:00 GMT+0200 (South Africa Standard Time))
SDS Event (Id:11, start: Tue Oct 04 2016 12:30:00 GMT+0200 (South Africa Standard Time), end: Tue Oct 04 2016 13:30:00 GMT+0200 (South Africa Standard Time))

All the times in the fetch() results are pushed forward.
My solution (more like hack) is to recreate the dates without the timezone info...

schema: {
  parse: function(events) {
    $(events).each(function(i, e) {
      //start & end date string, 2016-10-04T10:00:00.000Z
      e.start = new Date(e.start.substring(0,19)+"+0200");
      e.end = new Date(e.end.substring(0,19)+"+0200");
    })
    return events;
  }
}

Please advise on a more correct/efficient way to maintain the integrity of my times.

Many Thanks and Kind Regards,
Grant

3 Answers, 1 is accepted

Sort by
0
Rosen
Telerik team
answered on 06 Oct 2016, 06:38 AM

Hello Grant,

As you know the JavaScript Date instances are always created in the timezone of the browser. This will cause the shift you have noticed. In order to instruct the SchedulerDataSource to do the conversion automatically you should set the timezone setting. More information about the timezones and how to setup the scheduler widget can be found in this help article.

Regards,
Rosen
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
0
Grant
Top achievements
Rank 2
Veteran
Iron
answered on 06 Oct 2016, 10:41 AM

Hi Rosen, 

Thanks for the response, but the timezone setting isnt making any difference. 

I've removed my date string hack and set the timezone on the scheduler to 'Africa/Johannesburg' (+0200) but theres been no change, in fact no matter what timezone I set, the times are unaffected, I set it to a -0600 one and there was no change.

Is there no way to initialize a date as already being in a specific timezone?

Thanks,
Grant

0
Accepted
Rosen
Telerik team
answered on 06 Oct 2016, 02:34 PM

Hello Grant,

If you are setting timezone other than "Etc/UTC"  you should verify that the  kendo.timezones.min.js file is included.

In case you continue to experience difficulties please provide a small runnable sample which demonstrates the behavior in question locally.

Regards,
Rosen
Telerik by Progress
 
Get started with Kendo UI in days. Online training courses help you quickly implement components into your apps.
 
Tags
Data Source
Asked by
Grant
Top achievements
Rank 2
Veteran
Iron
Answers by
Rosen
Telerik team
Grant
Top achievements
Rank 2
Veteran
Iron
Share this question
or