jquerykendo-uigriddatasourcekendo-chart

KendoUI chart datasource from grid datasource with JQuery won't render


What I am trying to do is dynamically render a chart based on the contents of the KendoUI crid on my page. This is to happen within the DataBound event of the grid. When I try the code below it seems like the space of the gchart is allocated on the page but nothing rnders. I can see through Firebug that the datasource data is in the chart. Also I can see a legend for the chart will render but no chart. I should mention that there is no model passed to this chart. Also I tried hardcoding test data and setiing my datasource to that and still no rendering of the chart.

function onDataBound(arg) {
    gridDataSource = arg.sender.dataSource;
    if (gridDataSource.group().length > 0) {

        var theChart = $("#chart").data("kendoChart");

        theChart.options.series[0].field = "VALVAL_ALT_CMB_AMT";
        theChart.options.series[0].categoryField = "RCD_NUM";
        theChart.options.series[0].data = gridDataSource._data;
        theChart.refresh();

    }
}

Solution

  • I found the answer to the problem - I could not just set the datasource from the grid to the chart. I needed to first create anew datasource and then set the data property within it to the data from the grid... then setDataSource on the chart and it worked