jQuery 的 Kendo UI - 图表数据绑定事件不起作用答案

【问题标题】：KendoUI for jQuery - Chart dataBound event does not workjQuery 的 Kendo UI - 图表数据绑定事件不起作用
【发布时间】：2020-03-17 15:01:47
【问题描述】：

这是我的数据的简化示例：

[{"Name": "Bob", "Count":3}, {"Name": "Steve", "Count":5}]

我想要的是一个图表标题：Total FOO: 8。所以标题必须基于数据。数据是 AJAX，这是一个 ASP.MVC 应用程序。

在我的 CSHTML 中，我有：

.DataSource(ds => ds.Read(read => read.Action("MeMethodName", "MyControllerName")))
.Events(events => events.DataBound("setChartTitle('chartName', 'Total FOO')"))

这是我必须做的疯狂黑客：

   function setChartTitle(name, title) {
      let chart = $("#" + name).data("kendoChart");
      if (chart) {
         let ds = chart.dataSource;
         let total = 0;
         for (let i = 0; i < ds.data().length; i++) {
            total += ds.data()[i].Count;
         }

         chart.options.title.text = title + ": " + total;
         chart.refresh();
      } else if (arguments.length < 3) {
         // Data source was not found and this was initiated through Kendo. Wait and try again but only once
         setTimeout(function () {
            sumEntityCount(name, title, "stop");
         }, 500);
      }
   }

这真的很糟糕。

访问kendoChart 返回未定义，但图表本身调用它。这就是为什么我需要检查上面的if (chart)。
这导致我添加了一个 ELSE 块，我可以在 500 毫秒延迟后再次调用它。仅此一项就是一个错误，因为 500 毫秒是一个随机数，可能还不够。我不能这样发货。
为了防止递归，我用不同的参数调用同一个函数。
如果找到值，那么我不能只设置图表选项。我需要打电话给refresh，它会重绘所有内容。

问题：

为什么最初未定义 kendoChart 数据？为什么 Telerik 打电话给dataBound 却什么都没有？！
没有dataBinding 事件吗？我不想事后这样做，也不想刷新整个事情。

【问题讨论】：

标签： kendo-ui kendo-asp.net-mvc kendo-chart

【解决方案1】：

当你声明一个基本函数而不调用它时，图表本身就会被传入：

.events(events => events.Render("someFunction"))

然后声明你的函数：

function someFunction(sender) {
   // sender.chart is what I want
}

但是你不能在这里传递任何参数。这意味着我不能使用它。

破解方法是：

.Events(events => events.Render("function(sender) { someFunction(sender, 'param1', 'param2', 'param3'); }"))

这给了它一个实际的函数，而不是调用一个函数。 Kendo 按预期传递发送者，您可以将其与新参数一起传递给您的 JavaScript。

我也改用 Render 而不是 DataBound。

【讨论】：