0

我正在尝试对剑道网格中的事件进行回调。我的同事已经开始使用 MVC 助手创建网格。所以我试图像这样绑定到网格：

Html.Kendo().Grid<DetailViewModel>()
        .Name("details")
        .Events(events => events.DataBound(@<text>function () {
                                            $('input:checkbox.details-checkbox').click(function () {
                console.log("checked");
                handleChecked();
             });
           }</text>))

所以查看文档，我不知道为什么我必须在这里使用@标签。我以为我可以输入回调的名称，例如“handleChecked”。但这对我不起作用。所以我把它包装在@标签中。因此，按照当前的设置方式，它确实将“已检查”文本发送到控制台。但是，我实际上希望在选中复选框时调用一个方法。我宁愿不必把它放在那个功能块中，因为它会变得一团糟。所以我尝试做的是准备好文档，定义handleChecked。看起来像：

@{
Html.Telerik().ScriptRegistrar()
    .Scripts(wa => wa.AddSharedGroup(@Url.AssetName(AssetGroups.SinglePageApps)))
    .OnDocumentReady(
        @<text>
             $(document).ready(function () {

                          function handleChecked() {
                console.log("handle checked");
             }
             console.log("document.ready");
             });

         </text>);
}

因此，当我尝试运行它并单击一个复选框时，我得到 handleChecked() 未定义。所以我不确定在网格填充数据后绑定到剑道网格中的行的最佳方法是什么。它现在正在呈现服务器端，我正在尝试将函数回调到 DataBound 事件，但是遇到了一些麻烦。有什么想法吗？提前致谢。

4

1 回答 1

2

阻止事情按您想要的方式工作的最大问题是您将 JavaScript 函数包装在 DOMReady 函数中。

在 JavaScript 中，一个函数定义了作用域——这意味着在另一个函数中定义的任何变量或函数将只存在于外部函数中。

例如：


function foo(){
  function bar(){ console.log("bar"); }
  bar();
}

foo(); // => logs "bar" to the console
bar(); // fails; bar is undefined / not a function

当我foo()在底部调用时， foo 函数定义了一个嵌套bar函数，然后它会调用它。但是，当我bar()在那之后打电话时，它失败了。这是因为bar只存在于foo()函数内部。一旦foo函数退出，bar就超出范围并且不再可用。

鉴于此，您不想将handleChecked函数包装在 DOMReady 函数中。相反，您希望将该函数放置在整个应用程序都可以访问的地方。

现在为了简单起见，我建议您直接将函数放在 Razor 页面的<script>标记中：

<script type="javascript">
  function handleChecked(){
    // ... do stuff here ...
  }
</script>

无需围绕此使用任何 Razor 语法。这只是嵌入在页面中的普通 HTML 和 JavaScript。

一旦你有了这个，你可以直接向你的events.DataBound函数调用提供“handleChecked”函数名：


  // ...
  .Events(events => events.DataBound("handleChecked"))
  // ...

现在该函数可从页面中的任何位置使用，它会在“DataBound”事件触发时找到。

希望有帮助。

于 2013-04-26T20:38:10.167 回答