Error moving events in Scheduler when grouping by a remotely-bound resource

[Kyle]

Attempting to move a scheduler event when grouping by a resource with a remote data source produces the following console errors.

Uncaught TypeError: Cannot read property 'value' of undefined
Cannot read property 'groupIndex' of undefined

All events are unable to moved unless I double click an event and open it's edit menu first thing upon the scheduler data being bound and before taking any other action in the scheduler.

Both the scheduler data source and the resource data source are remote; however, when I hard-code the resource data source to match what the remote output would be, the scheduler works as intended.

Here's what my scheduler initialization code looks like.

$(function() {
            var dataSource = new kendo.data.SchedulerDataSource({
                transport: {
                    read: {
                        url: 'service url', /* omitted for example */
                        type: 'GET',
                        data: {
                            account_id: 'myAccountId'
                        },
                        dataType: "json",
                        beforeSend: function(req) {
                            req.setRequestHeader('example-api-key', '1234');
                        }
                    },
                    update: function(e) {
                        e.success();
                    }
                },
                schema: {
                    data: "schedulerEvents"
                }
            });
            
            $("#scheduler").kendoScheduler({
                date: new Date(),
                toolbar: [ "search" ],
                eventHeight: 50,
                selectable: true,
                views: [
                    "day", "week", "month", "agenda", {type:"timeline", selected: true}, "timelineWeek", "timelineMonth"
                ],
                dataSource: dataSource,
                group: {
                    resources: ["Assignees"],
                    orientation: "vertical"
                },
                resources: [
                    {  
                        field: "assignees",
                        title: "Assignees",
                        name: "Assignees",
                        dataSource: {
                            transport: {
                                read: {
                                    url: 'service url', /* omitted for example */
                                    type: 'GET',
                                    data: {
                                        account_id: 'myAccountId'
                                    },
                                    dataType: "json",
                                    beforeSend: function(req) {
                                        req.setRequestHeader('example-api-key', '1234');
                                    }
                                }
                            },
                            schema: {
                                data: "assignees"
                            }
                        },
                        multiple: true
                    }
                ]
              });
        });

The response data from the server looks like this:

{
  assignees: [{ value: "1234", text: "Assignee Name" }],
  schedulerEvents: [{ assignees: ["1234"], id: "9876", title: "Event Title", start: "2021-05-27T00:00:00", end: "2021-5-28T00:00:00" }]
}

You'll notice in my screenshot that the events appear to be grouped correctly, but nonetheless produce errors when clicking on them or trying to move them.

At a loss as to what may be causing this. Perhaps I'm missing something when it comes to binding remote data. Please let me know if there's anything I can do to solve this issue.

[Neli]

Hi Kyle,

Thank you very much for your patience. 

I tried to replicate the issue in a local sample project. However, events could be moved without any issues on my end, even if grouping is enabled and remote resources are defined. Here is a Dojo example where this is demonstrated. As you will see, the events could be edited or moved without errors. 

May I ask you to modify the Dojo example in order to replicate the behavior the way it is at your side and send it back for a review? This way we could take a closer look and advise you further.

Additionally, I noticed in the provided snippet that you are configuring in a different way the read and update transport options. Please note, that 'All transport actions (read, update, create, destroy) must be defined in the same way, that is, as functions or as objects. Mixing the different configuration alternatives is not possible.' This is documented in the dataSource API. Thus, I would recommend configuring all Scheduler datasource transport actions either as functions or as objects.

Regards,
Neli
Progress Telerik

[Kyle]

Hi Neli,

Thank you so much for your response. I used your sample project to test my own event and resource APIs and everything was working correctly, however for some reason it wasn't working on my local machine. That's when I noticed the kendo.all.min.js versions were different between your project and mine, so I updated that and everything is working smoothly. Thank you for the help and the advice!

Kyle

[Neli]

Hello Kyle,

I will need some additional time to review the request. I will get back to you once I have more information on the issue.

Thank you very much for your patience.

Regards,
Neli
Progress Telerik