1

I am a beginner to Telerik's Kendo UI Toolset and am having trouble connecting my UI Chart to our SharePoint's REST API. The chart displays when I debug the add in, in Visual Studio. However, the chart does not populate. I am trying to retrieve the "Problems" and "Month" column from the items in the list. Any ideas? All suggestions are welcomed!

<script>
    function createChart() {
        $("#chart").kendoChart({
            dataSource: {
                transport: {
                    read: {
                        url: "OurSharePointDomain/_api/Web/Lists(guid'9f63673a-8a89-4e53-bfca-86f359d1ff09')/Items",
                        dataType: "json",
                        headers: {
                            "accept": "application/json; odata=verbose"
                        }
                    }
                },
                schema: {
                    parse: function (response) {
                        var result = [];
                        for (var i = 0; i < response.d.results.length; i++) {
                            var item = {};
                            var Prob = new Prob(response.d.results[i]Problems);
                            var Mon = new Mon(response.d.results[i]Month);
                            result.push(item);
                        }
                        return result
                    }
                }
            },
            title: {
                text: "Kendo UI Chart That Won't Work"
            },
            legend: {
                position: "top"
            },
            seriesDefaults: {
                type: "area"
            },
            series: [{
                    field: "Prob",
                    name: "Problems"
                }
            }],
            categoryAxis: {
                field: "Mon",
                labels: {
                    rotation: -90
                },
                crosshair: {
                    visible: true
                }
            },
            valueAxis: {
                labels: {
                    format: "N0"
                },
                majorUnit: 5
            },
            tooltip: {
                visible: true,
                shared: true,
                format: "N0"
            }
        });
    }
    $(document).ready(createChart);
    $(document).bind("kendo:skinChange", createChart);
</script>
  • If the answer was helpful could you remove it from the SO unanswered list, by marking it as answered, tnx – Danny '365CSI' Engelman Jun 4 '17 at 7:54
0

This is plain JavaScript programming error.. nothing to do with SP or Kendo

Learn to use the F12 Console

Or read your own code:

 var result = [];
 for (var i = 0; i < response.d.results.length; i++) {
     var item = {};
     var Prob = new Prob(response.d.results[i]Problems);
     var Mon = new Mon(response.d.results[i]Month);
     result.push(item);
 }
 return result

What are the items in the result list?

  1. you are creating an error with: [i]Problems

  2. You are not putting anything IN the item object

FYI, this is less error prone:

return result = response.d.results.map(function(item){
    return {
             Prob:item.Problems,
             Mon:item.Month
           }
});

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.