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

2 Answers 19 Views
Data Source Scheduler
Kyle
Top achievements
Rank 1
Kyle asked on 27 May 2021, 10:58 PM

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.

2 Answers, 1 is accepted

Sort by
1
Accepted
Neli
Telerik team
answered on 03 Jun 2021, 09:24 AM

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

Love the Telerik and Kendo UI products and believe more people should try them? Invite a fellow developer to become a Progress customer and each of you can get a $50 Amazon gift voucher.

Kyle
Top achievements
Rank 1
commented on 03 Jun 2021, 05:22 PM

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
0
Neli
Telerik team
answered on 01 Jun 2021, 03:05 PM

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

Virtual Classroom, the free self-paced technical training that gets you up to speed with Telerik and Kendo UI products quickly just got a fresh new look + new and improved content including a brand new Blazor course! Check it out at https://learn.telerik.com/.

Tags
Data Source Scheduler
Asked by
Kyle
Top achievements
Rank 1
Answers by
Neli
Telerik team
Share this question
or