javascript - 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 中取消绑定(bind)和绑定(bind)剑道事件。例如尝试这样的事情:

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

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

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