Question

我试图改变＆＃34;改变＆＃34;一个Kendo UI下拉列表的事件，但不幸的是我没有运气。这是我迄今为止尝试过的代码：http://trykendoui.telerik.com/ukeV

具体来说，这是我的下拉列表初始化程序：

var onChange = function(e)
{
    alert("something changed");
};
// create DropDownList from input HTML element
$("#dropdown").kendoDropDownList({
    dataTextField: "text",
    dataValueField: "value",
    dataSource: data,
    index: 0,
    change: onChange
});

这是我后来尝试改变这个功能的方法：

onChange = function(e){alert("attempt 1");};
var dropDownData = $("#dropdown").data("kendoDropDownList");
dropDownData.options.change = function(e){alert("attempt 2");}
dropDownData.refresh();

具体来说，我首先尝试更改onChange函数，然后（当它没有工作时），我尝试直接更改options.change函数。虽然options.change函数确实发生了变化（当我在chrome调试器中检查它时），但是下拉列表的实际功能保持不变。我想我需要刷新下拉列表或其他内容才能使我的编辑实际生效。有谁知道我怎么能真正让kendo网格刷新并显示我的数据？

Answer 1

我看到你已经找到了解决办法，但我想我还要补充一些解释。

之所以如此改变

onChange = function(e){alert("attempt 1");};

不起作用是您将一个函数传递给窗口小部件，并且窗口小部件在适当的时间调用该函数。您没有传递对变量onChange的引用。因此，更改变量不会影响窗口小部件。

原因

dropDownData.options.change = function(e){alert("attempt 2");}

没有用的是Kendo将处理程序存储在自己的结构中（这是必要的，因为你可以为同一个事件绑定多个处理程序！），所以它不会调用{{1}中的任何内容在任何给定的时刻。

但是，有一种options.change方法，您可以通过这种方法使您的第二种方法有效：

setOptions

Answer 2

我最终使用了简单的解决方法。当我放入行

change: onChange

Kendo实际上在函数体中硬编码到dropDownData.options.change函数中，而不是引用我的命名javascript函数。它在调试器中看起来像这样：

function(e)
{
  alert("something changed");
};

所以我的解决方法就是在Kendo调用中使用匿名函数。所以我改变了：到

change: function(e) { onChange(e) };

然后当我稍后改变onChange时，kendo引用了命名的javascript函数并调用了我的更新版本。这是工作演示：http://trykendoui.telerik.com/AkIW/2

修改Kendo UI Dropdownlist的更改事件

2 个答案: