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

Gantt chart - refresh data source

1 Answer 9 Views
This is a migrated thread and some comments may be shown as answers.
Mariusz
Top achievements
Rank 1
Mariusz asked on 10 Aug 2018, 12:11 PM

Hello,

 

I use yours gantt wrapper, but I have problem with refresh or change datasource when some event happened. I check reactive changes at others wrapers i.e. grid and ther this is working fine. I try also manipulate yours exemples at sandbox and plnkr, but it always fails. 
I'd do something like that. 

var app = new Vue({
data() {
   mySource: []
},
mounted: function(){
  this.mySource = [{ id: 1, end: "xx"..... }];
}
})

 

How can i do this? I found some post and then was admin anserw that vue-wrappers from wersion 2018.2.xxx are reactived. I will be greatfull for working plnkr. 

1 Answer, 1 is accepted

Sort by
0
Ivan Danchev
Telerik team
answered on 14 Aug 2018, 11:14 AM
Hello Mariusz,

As I mentioned in the support thread with the same topic you started, the ref attribute can be used to get a reference to the Gantt and to set new data to its dataSource with the data API method, for example:
<kendo-gantt id="gantt" ref="gantt1"
            :height= 500
            :data-source="mySource">
</kendo-gantt>

new Vue({
    el: '#vueapp',
    data: {
      mySource: []
    },
    mounted() {
      var gantt = this.$refs.gantt1.kendoWidget();
      var data = [{
              id: 0,
              orderId: 0,
              parentId: null,
              title: "Main Project",
              summary: true,
              expanded: true,
              start: new Date("2014/6/17 9:00"),
              end: new Date("2014/6/17 15:00")
          },
          {
              id: 1,
              orderId: 1,
              parentId: 0,
              title: "Task1",
              percentComplete: 0.47,
              start: new Date("2014/6/17 09:00"),
              end: new Date("2014/6/17 12:00")
          },
           {
              id: 2,
              orderId: 2,
              parentId: 0,
              title: "Task2",
              percentComplete: 0.5,
              start: new Date("2014/6/17 09:30"),
              end: new Date("2014/6/17 12:30")
        }]
          
      gantt.dataSource.data(data);
    }
})


Here's a plunker example that demonstrates this.

Regards,
Ivan Danchev
Progress Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Asked by
Mariusz
Top achievements
Rank 1
Answers by
Ivan Danchev
Telerik team
Share this question
or