SchedulerDataSource, Cannot read property 'data' of undefined

[Grant]

Morning, 

I've created a widget that uses the KendoScheuler inside a kendoWindow and sets its DataSource dynamically. Code below, shortened for brevity:

CODE:

function openWindow(optionOverrides) {
  var options = {
    /**
     * @type {Array | kendo.data.SchedulerDataSource}
     * @required
     * The dataSource where existing events are read from, can be a kendo.data.SchedulerDataSource or a JavaScript Array.
     * If an array is used a new kendo.data.SchedulerDataSource will be created with the 'data' attribute set as the array
     */
    dataSource: null
  };

  //Validate a dataSource exists
  if (!validateArgument(optionOverrides.dataSource, ["object"])) {
    console.error("SchedulerDataSource of incorrect type. Expected: object; found: " + typeof optionOverrides.dataSource);
    return false;

  } else {
    if ((optionOverrides.dataSource).constructor == Array) {
      //If the optionOverrides.dataSource is an array, use it to create a new kendo.data.SchedulerDataSource containing the array data
      var schedulerDS = new kendo.data.SchedulerDataSource({
        data: optionOverrides.dataSource
      });

      options.dataSource = schedulerDS;

    } else if ((optionOverrides.dataSource).constructor == kendo.data.SchedulerDataSource) {
      //Use optionOverrides.dataSource if it is already a kendo.data.SchedulerDataSource
      options.dataSource = optionOverrides.dataSource;

    } else {
      console.error("optionOverrides.dataSource object not of type Array or kendo.data.SchedulerDataSource");
      return false;
    }
  }

  var dfd = $.Deferred();
  var result = null;

  $("<div />")
    .attr("id", "window-schedulerWindow")
    .appendTo("body")
    .kendoWindow({
      visible: false,
      modal: true,
      resizable: false,
      title: options.title,

      activate: function(e) {
        //Hide the headers of the scheduler
        var timePickerScheduler = $("#scheduler-scheduleTimePickerWindow-timePicker").data("kendoScheduler");

        //Set data source after initialization. Prevents data being loaded before the scheduler is ready
        timePickerScheduler.setDataSource(options.dataSource);
      },

      open: function(e) {
        var timePickerScheduler = $("#scheduler-scheduleTimePickerWindow-timePicker").kendoScheduler({
          /* Attributes removed for Brevity */

         edit: function(e) {

               e.preventDefault(); //prevent default event editing

               //Retrieve and sync the dataSource with the new event generated in the 'add' callback
              var dataSource = this.dataSource;
              dataSource.sync();
            }

        }).getKendoScheduler();

         }

 

    }).data("kendoWindow")
      .content($("#template-schedulerTimePickerWindow").html())
      .center()
      .open();

  return dfd.promise();
}

The Problem:
So the issue Im having is that if the SDS is created fresh from an array of Event Objects, everything works fine, however, if I specify an already existing SDS, that uses remote data, and then start dragging and resizing events, I get the error: "Cannot read property 'data' of undefined", which points to statement 'dataSource.sync();' in the 'edit' event of my scheduler.

Is there some kind of sync trying to happen with the remote SDS? I monitored my network activity and didnt see anything.

Please advise, Thanks,
Grant

 

 

[Rosen]

Hello Grant,

Indeed, the DataSource sync method will try to push the changes to the server. Therefore, you should verify that the DataSource transport is correctly configured for CRUD operations.

Regards,
Rosen
Telerik by Progress