Javascript 剑道UI网格后期渲染还是后期数据绑定事件?

Javascript 剑道UI网格后期渲染还是后期数据绑定事件?,javascript,kendo-ui,telerik,kendo-grid,telerik-grid,Javascript,Kendo Ui,Telerik,Kendo Grid,Telerik Grid,在通过ajax重新加载网格后,是否有方法触发事件 我看到了RequestEnd事件。但这似乎是在请求返回时发生的,但在网格刷新之前 我还看到了数据绑定事件。但这种情况甚至早于RequestEnd, 此外,当我实现数据绑定事件时,我的头也会消失 我不得不求助于这个黑客 函数请求端(o){ 调试('请求结束',o); setTimeout(refreshEditable,500);//有足够的时间渲染网格 } 函数refreshEditable(){ //对网格内容中的控件执行我的操作 } 作为旁

在通过ajax重新加载网格后,是否有方法触发事件

我看到了RequestEnd事件。但这似乎是在请求返回时发生的,但在网格刷新之前

我还看到了数据绑定事件。但这种情况甚至早于RequestEnd,
此外,当我实现数据绑定事件时,我的头也会消失

我不得不求助于这个黑客

函数请求端(o){
调试('请求结束',o);
setTimeout(refreshEditable,500);//有足够的时间渲染网格
}
函数refreshEditable(){
//对网格内容中的控件执行我的操作
}
作为旁注。。我很难找到一个可靠的剑道网格MVCAPI参考。当我搜索它时,我得到了以下信息: 这是一个小操作和一些“事件”的集合,但这些与我在razor Intellisense中看到的不一致

更新:添加数据绑定定义

    $('#grid').kendoGrid({
        dataBound: function(e) {
            console.debug('data bound..');
        }
    });
   .Ajax().Read(read => read
        .Action("FilesRead", "SomeController")
        .Data("readData"))

 function readData() {
    return {
        IncludeChildren: $("#IncludeChildren").is(':checked'),
        SearchString: $('input[id=SearchString]').val()
    };
 }
这里是网格ajax的定义

    $('#grid').kendoGrid({
        dataBound: function(e) {
            console.debug('data bound..');
        }
    });
   .Ajax().Read(read => read
        .Action("FilesRead", "SomeController")
        .Data("readData"))

 function readData() {
    return {
        IncludeChildren: $("#IncludeChildren").is(':checked'),
        SearchString: $('input[id=SearchString]').val()
    };
 }
我可以看到,数据绑定是在进行ajax调用时触发的,而不是在它返回后触发的

更新

更正了数据绑定事件挂钩

在dataBound函数中,我试图获取对新渲染模板的引用

function dataBound(o) {
  console.debug($('span.editable').length);                    // returns 0 
  setTimeout("console.debug($('span.editable').length)", 500); // returns 4
}
跨距是使用客户端模板添加的

.ClientTemplate(@"<span class=""editable"" ... >#=DOCUMENT_DATE_FORMATTED#</span>");
.ClientTemplate(@“#=文档日期格式”);

明白我的意思吗?数据绑定发生在网格呈现之前

有关如何使用MVC包装绑定事件处理程序的信息,请参见(API文档中关于事件的部分)中的示例代码:

@(Html.Kendo().Grid(Model)
      .Name("grid")
      .Events(e => e
          .DataBound("grid_dataBound")
          .Change("grid_change")
      )
)
<script>
function grid_dataBound() {
    //Handle the dataBound event
}

function grid_change() {
    //Handle the change event
}
</script>
在此处执行此操作时:

$('#grid').kendoGrid({
    dataBound: function(e) {
        console.debug('data bound..');
    }
});
您实际上创建了一个新的网格实例。

您可以这样使用:

 transport: {
           read: {
           url: searchUrl,
           type: "POST",
           dataType: "json",
           data: additionalData,
           complete: function () {
              //code here :)
           }
        },                   
     },

我曾经遇到过这样的情况,(在紧要关头),当网格将行插入DOM时,可能会部署一个MutationObserver来“感知”。在大多数情况下,网格自己的数据绑定事件就足够了。但是,当出现以下情况时:

  • 渲染阻塞JS,可能在初始页面加载时,和/或
  • 连接速度慢/延迟时间长,和/或
  • 来自服务器端包装器的剑道JS结构混乱,与脚本块混合在一起
无论如何,在渲染行之前,隐藏在网格中的tbody标记将如下所示:

var grid = $("#grid").data("kendoGrid");
grid.bind("dataBound", function(e) {});
               <tbody>
                   <tr class="k-no-data">
                       <td colspan="9"></td>
                   </tr>
               </tbody>

将检测DOM中的更改。实际上,这将创建一个“rowsRendered”网格事件。我曾经遇到过这样一种情况:有很多人坐在一排的座位上观看图表演示;(见附件)。以编程方式,需要选择行(基于指定的日期范围),然后打开一个窗口并填充对数图表。

更新DOM后会触发数据绑定事件;如果没有得到预期的结果,则代码有问题,因此应该添加that@LarsHöppner添加了该代码。。如果需要更多,请告诉我。那些span.editable元素是哪个模板的一部分?它们位于ClientTemplates中的少数列中。。使最新的代码更加清晰。。这些字段确实会出现,只是在数据绑定后有一些延迟。。因此,很明显,此事件发生在呈现新行之前,因此添加了客户端模板定义。。我要寻找的是一个事件,该事件在行被添加到正确位置后触发。。我错过了新的实例部分,我所看到的事件是在数据源上,而不是在网格上。你发布的文档的问题是,这是一篇很长的a-z如何操作的文章。我真的很想找到一个事件api文档。。这似乎是一个不可能完成的任务,实际上数据绑定仍然发生得太快。它发生在取回集合的同时,但在呈现内容之前。我知道这一点,因为我调用了一些选择渲染元素的javascript。。我将发布一个samples,这是一个有趣的奖励,当我添加dataBound:function(e)定义时,仅使用console.debug行,我的整个网格头将下降到网格的底部!嗯,这显然不应该发生。不幸的是,如果没有问题的演示,就无能为力