Cannot get an array to display in a line chart using either JS / KnockoutJS

Question

I have an ajax database call to get date fields that basically look like this. ["2016-3", "2016-5", "2016-6", "2016-7", "2016-8"]When I call them from db, I get them exactly as you see in the array, but I can’t get them working on the chart, if I manually type this array, it works, but if I use the observed array or just a regular js array Both do not work. Here is the code to call ajax.

  var  arr = [ ]; //normal js array 
    self.DateArray = ko.observableArray(); // knockout js array 
    self.LineChart = function () {
            $.ajax({
                type: 'POST',
                url: BASEURL + 'index.php/moneyexchange/portfolioDevelopment/' + auth ,
                contentType: 'application/json; charset=utf-8'
            })
            .done(function(data) {
              console.log(data);
               arr = data.slice();
               self.DateArray(data);
               console.log(self.DateArray());
                console.log(arr);
            })
            .fail(function(xhr, status, error) {
                alert(status);
            })
            .always(function(data){                 
            });
        };
      self.LineChart(); 

Both console.log show this.

The line chart works because the values ​​are entered manually.

this.MasnadsLineChart = {
                    labels: ["2016-3", "2016-5", "2016-6", "2016-7", "2016-8"],
                    datasets: [
                        {
                            label: "My First dataset",
                            fillColor: "rgba(220,220,220,0.1)",
                            strokeColor: "yellow",
                            pointColor: "#ffcc33",
                            pointStrokeColor: "#fff",
                            pointHighlightFill: "#fff",
                            pointHighlightStroke: "rgba(220,220,220,1)",
                            data: [65, 59, 80, 81, 56, 55, 40,80, 81, 56, 55, 40]
                        },
                        {
                            label: "My Second dataset",
                            fillColor: "rgba(151,187,205,0.1)",
                            strokeColor: "rgba(151,187,205,1)",
                            pointColor: "rgba(151,187,205,1)",
                            pointStrokeColor: "#fff",
                            pointHighlightFill: "#fff",
                            pointHighlightStroke: "rgba(151,187,205,1)",
                            data: [41, 48, 40, 19, 86, 27, 90 ,80, 81, 56, 55, 40]
                        }
                    ]
                };

labels : self.DateArray() labels : arr , , . , ajax , https://github.com/grofit/knockout.chart

Answer 1

arr , arr .

, KO , , .

:

.done(function(data) {
    self.DateArray(data);
})

:

labels : self.DateArray() labels : arr,

KO, , , :

labels: self.DateArray