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

Updating data and view

9 Answers 407 Views
Scheduler
This is a migrated thread and some comments may be shown as answers.
Markus
Top achievements
Rank 1
Markus asked on 27 Apr 2015, 06:26 AM

Hi

In my Kendo Scheduler I am adding an item to the data array (simulated by button click function).

I am trying to update the view, but the event does not show up, how can I properly update the view / refresh the Scheduler so that the data is re-read?

Here is my example: http://dojo.telerik.com/uKUzI/2

 

Many thanks

9 Answers, 1 is accepted

Sort by
0
Vladimir Iliev
Telerik team
answered on 29 Apr 2015, 07:25 AM
Hi Markus,

Basically when you pass the data to the scheduler dataSource it parses the object inside it based on the current schema - that why if you need to insert items into the array after the widget initialization you should use the "add" method of the dataSource and pass parsed model. 

Another option is to define dataSource "transport.read" option and pass a copy of the array to the success handler:


Regards,
Vladimir Iliev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Markus
Top achievements
Rank 1
answered on 29 Apr 2015, 08:25 AM

Hi Vladimir

Thank you for your update. I have updated my example to use the "add" method as specified in the documentation.

Do I need to run any "update" view method because my example does not show the added event yet?

http://dojo.telerik.com/AkIGO/13

I also tried defining the dataSource array beforehand and then using "add" like so http://dojo.telerik.com/iKEke

Thanks

0
Vladimir Iliev
Telerik team
answered on 29 Apr 2015, 08:46 AM
Hello Markus,

As I mention early the events that you pass to the "add" method should be parsed. Also you should access the scheduler dataSource instead of creating new instance. Please check the updated example below:

Regards,
Vladimir Iliev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Jin
Top achievements
Rank 1
answered on 30 Apr 2015, 04:48 AM

Hi Vladimir,

I am using Kendo Scheduler with AngularJS. I have the same problem that I can't update the view/refresh the Scheduler when I add an data item in dataSource.

 Here are two initial events, I bind them to the dataSource of $scope.schedulerOptions

        $scope.tempEvents = [
                {
                    id: 1,
                    title: 'Event1',
                    description: 'event1 Description',
                    start: new Date('2014/9/23'),
                    end: new Date('2014/9/23'),
                    isAllDay: true
                },
            {
                id: 2,
                title: 'Event3',
                description: 'event2 Description',
                start: new Date('2014/9/24'),
                end: new Date('2014/9/24'),
                isAllDay: true
            }
        ];

 

        $scope.schedulerOptions = {
            date: new Date("2014/9/23"),
            startTime: new Date("2014/9/23 07:00 AM"),
            height: 600,
            views: [
                "day",
                { type: "workWeek", selected: true },
                "week",
                "month",
            ],
            timezone: "Etc/UTC",
            dataSource: {
                data: $scope.tempEvents,
            }
        };

 

The two events show on the Scheduler.

 

Then, I click the Search button, in turn, it calls SearchCalendarInfo. In the SearchCalendarInfo method, I simply push a data item to the dataSource of $scope.schedulerOptions

 

 $scope.SearchCalendarInfo = function () {

                  $scope.schedulerOptions.dataSource.data.push({
                    id: 4,
                    title: 'Ann Leave',
                    description: 'Leave Description',
                    start: new Date('2014/9/27'),
                    end: new Date('2014/9/27'),
                    isAllDay: true
                 });
    }

 

But the new event is not showing on the Scheduler.

 

In HTML, the scheduler is defined as

 <div kendo-scheduler k-options="schedulerOptions">

 

Could you help?

 

Thanks

Jin

0
Vladimir Iliev
Telerik team
answered on 30 Apr 2015, 05:46 AM
Hello Jin,

To achieve the desired behavior in your scenario I would suggest to keep actual instance of the "SchedulerDataSource" attached to the scope - this way you can manipulate the data using it's API:


Regards,
Vladimir Iliev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
Jin
Top achievements
Rank 1
answered on 25 May 2015, 06:26 AM

Thanks Vladimir, the data could bind to the scheduler.

 But I get another problem. In $scope.SearchCalendarInfo function, do  $scope.dataSource.add to add each data item the datasource seems very slow. Is there a way to build an array of data and assign to the $scope.dataSource at once to improve the performance?

 

Your help is appreciated!

Thanks

Jin

0
Vladimir Iliev
Telerik team
answered on 26 May 2015, 09:40 AM
Hi Jin,

You can use the dataSource "data" method to do that - please check the example below:

Regards,
Vladimir Iliev
Telerik
 
Join us on our journey to create the world's most complete HTML 5 UI Framework - download Kendo UI now!
 
0
claude
Top achievements
Rank 1
answered on 28 Feb 2017, 11:02 AM

Excuse my English...

Hello,
I tried your method:

 Read: function (request) {
                            Var newData = JSON.parse (JSON.stringify (data));
                            Request.success (newData);
                        }

This works, the addition of item is displayed in the scheduler.
But there are still some errors when adding manual:
ERRORS:
An invalid form control with name = 'Title' is not focusable.
2DataScheduler: 1 An invalid form control with name = 'start' is not focusable.
2DataScheduler: 1 An invalid form control with name = 'end' is not focusable.
DataScheduler: 1 An invalid form control with name = 'IdVisite' is not focusable.

Then another point that also poses a problem,
Moving an item to a different date / time, create an error?
ERRORS:
Uncaught TypeError: Can not read property 'call' of undefined
    At an Object. <Http://localhost.org/> (S (yp2vk4huyv4envhn2grqdtaf)) /Scripts/kendo/kendo.all.min.js:27:29766)
    At Function.Deferred
...
For information, there is no property 'Call'
As a result of this error, the element disappears completely?

Another point, the last,
For eventTemplate: $ ("# EventTemplate") html (),
I display custom data, present in the source JSON and defined in the diagram,
The data is displayed correctly, but when moving, there is an error, which means that it does not know the property of a data item, then disappears.

Example of display data:
E.event.uid + e.slot.start + e.slot.end + e.event.title + e.event.visiteID + e.event.affaireID + e.event.description

Would you have the correction to the above problems?
Currently we use the trial version, but as soon as it will work as it suits us, the purchase will surely be effective.

Best regards.
Thomas

 

 

0
Vladimir Iliev
Telerik team
answered on 01 Mar 2017, 10:16 AM
Hi Claude,

From the provided information it's not clear for us what might be the reason for the described behavior in question 1 and 2. That why could you please open a new support ticket and provide runable example (how to isolate issue in example) where the issue is reproduced? This would help us pinpoint the exact reason for the described behavior.

Regards,
Vladimir Iliev
Telerik by Progress
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
Tags
Scheduler
Asked by
Markus
Top achievements
Rank 1
Answers by
Vladimir Iliev
Telerik team
Markus
Top achievements
Rank 1
Jin
Top achievements
Rank 1
claude
Top achievements
Rank 1
Share this question
or