javascript - KnockoutJS components with KendoUI chart only works for the last chart -


i have observable array of items creates components parameter.

within each component, use parameter query data (through ajax). return data observable array , use array data source kendoui chart.

example of list of created components parameter:

<csglist params="account:'08167526'"></csglist> <hr> <csglist params="account:'0873458'"></csglist> <hr> <csglist params="account:'0828337'"></csglist> <hr> <csglist params="account:'086778'"></csglist> 

call gets data

        getcategory = function () {             self.categorychart([]);             xhr_get(cont.publish + 'api/dbmain/getcategory', { 'id': params.account }).done(function (alldata) {                 var mappedlogs = $.map(alldata, function (item) { return new categorydata(item) });                 self.categorychart(mappedlogs);                 buildchart();             })         } function buildchart(){      $(document).ready(createchart);     $(document).bind("kendo:skinchange", createchart); } 

the create chart

 function createchart() {           $("#" + self.act() + "chart").kendochart({         datasource: {           data: ko.tojs(self.categorychart)             //, sort: { field: "category", dir: "asc" }         },         title: {           text: self.type()         },         legend: {           visible: true,           position: "bottom"         },         seriesdefaults: {           type: "bar",           stack: true         },         series: [{           field: "sales",           name: "current sales",           color: "#66110f"         }, {           field: "opp",           name: "opportunity",           color: "#e65f5b"         }],         valueaxis: {           //   max: 180,           line: {             visible: false           },           minorgridlines: {             visible: true           },           visible: false         },         categoryaxis: {           field: "category",           majorgridlines: {             visible: false           }         },         tooltip: {           visible: false,           template: "#= series.name #: #= value #"         }       });     } 

but when components created, last 1 has data.

can tell me why happening?

when changed the buildchart = function self.buildchart = function, works!


Comments