Problem binding JSON data with Kendo Line Chart

[Claudia]

Hi there,

I am just getting starting and I cant seem to make the line chart work when I bind it to a json file.

I followed your documentation and here is the code and attached the files:

function createChart() {
                    
 var dataSource = new kendo.data.DataSource({
  transport: {
   read: "sales.js",
   dataType: "json"
                        }
 });
 
 $("#chart").kendoChart({
  dataSource: dataSource,
  theme: $(document).data("kendoSkin") || "BlueOpal",
   legend: {
   position: "top",
 },
  chartArea: {
   background: "",
 },
 series: [{
  field: "value",
 }],
  categoryAxis: {
  field: "year",
 }
});
}




sales.js file:

[ { "year": "2000", "value": 200 },
  { "year": "2001", "value": 450 },
  { "year": "2002", "value": 300 },
  { "year": "2003", "value": 125 },
]

Regards
Claudia

[Alexander Valchev]

Hello Claudia,

I have already answered your support ticket on the same subject. For convenience I am pasting my reply here as well.

I believe the problem is caused by the contentType of the data send back by the server. The extension of your file is .js, so it is interpret as JavaScript, not as a Json file (please see the attached image).

The dataType property should be part of the read object, the solution would be to try with the following configuration: 

var dataSource = new kendo.data.DataSource({
    transport: {
        read: {
            url: "sales.js",
            dataType: "json",
            contentType: "application/json; charset=utf-8"
        }
    }
});

I hope this will solve the problem.

Greetings,
Alexander Valchev
the Telerik team