Kendo MVC Chart - 渲染事件问题

Question

所以我使用 Telerik 的 Kendo MVC 包装器来呈现条形图。

当Render事件被触发时，我输入了一个JavaScript函数；但是，当我尝试使用 setOptions() 方法调整图表大小时，我陷入了无限循环。

例如：

onRender: function (e)
    {
        e.preventDefault();

        console.log("Render");
        var compareChart = $("#chart").data("kendoChart");        

        var wt = compareChart.element.parent().width();
        var ht = compareChart.element.parent().parent().height()
     
        // **** THIS CAUSES TO TRIGGER onRender INFINITELY ****
        compareChart.setOptions({ chartArea: { height: ht, width: wt } });

        return;
    }

@(Html.Kendo().Chart()
   .Name("chart")
   .ChartArea()
   .series.Bar()
   .Events(events => events
   .Render("onRender")      // *** ON RENDER EVENT ***
 )

我怀疑我必须使用 e.preventDefault(); 之类的东西，但不确定如何在 Kendo 包装器定义中设置它：

  .Events(events => events
       .Render("Whatif.onRender")     
  )

调用compareChart.setOptions Kendo 方法后，如何取消我的自定义onRender js 函数。

感谢您的建议...

谢谢， 鲍勃

Answer 1

您可以在 javascript 中解绑和绑定剑道事件。例如尝试类似：

compareChart.unbind('render');
compareChart.setOptions({ chartArea: { height: ht, width: wt } });
compareChart.bind('render', onRender);  //Probably need to prefix onRender with the parent object

希望这意味着您的函数在 setOptions 运行时不会再次触发。当然如果只需要运行一次，就不需要再次绑定事件了。

顺便说一句，preventDefault() 只会阻止任何关联的 DOM 事件触发，而不是那些由 kendo 代码触发的事件。