单击kengo网格行内的kendo图表

Question

I have a kendo grid. And one of the columns contains stacked kendo chart one per row. Here is how I create charts inside the grid using the dataBound event:

self.dataBound = function() {
    $(chartCellSelector).each(function () {

        var $this = $(this);
        $this.kendoChart({
            //chart options go here
        });
    });
};

Then I also how a rowselect grid event.

self.rowSelect = function (e) {
    var dataItem = e.sender.dataItem(this.select());
    //operations with the dataitem
};

When I click on the row outside of the chart control it works fine everywhere. However when I click on the row inside the stacked chart, then sometimes JS error occur: Strangely it occurs only in IE and only on some of the machines: Error: Unable to get property 'removeChild' of undefined or null reference

The crash is inside kendo internal javascript libs, so it looks like kendo bug. I need a workaround for this. Even disabling the click over the stacked chart would be fine, but that is not easy to achieve. So the question is either how to avoid javascript bug in kendo or how to disable kendo rowselect event over some of the cells(or divs inside the cells)?

Answer 1

This is a Kendo bug. I've investigated Kendo javascript a bit and the error occurred because of series.highlight property! I simply removed highlights on the configuration like this and the error disappeared.

seriesDefaults: {
                highlight: { visible: false },
                ...
            },