javascript - 如何检测已在 Kendo UI 网格中创建网格行？

Question

我正在使用从异步调用加载的 Kendo UI Grid 对象(Javascript 版本)。行是从行模板创建的，行模板为每一行定义了一些按钮 - 这些是纯 HTML INPUT 元素 - 所有处理它们的代码都在单独的 Javascript 文件中。

创建网格时(即所有 TR 元素都已通过 Grid 控件在 DOM 中创建)我需要遍历所有行并附加事件各种按钮的处理程序并更新它们的一些属性。我的问题是我不知道网格何时创建 DOM 元素(TR-s)。我尝试使用已触发的 dataBound 事件，但尚未创建网格 DOM - 只能操作响应数据。我还尝试了 detailInit 事件，但没有触发(我并不感到惊讶 - 网格没有详细信息项)。

我找到了 this Telerik forum Telerik 代表建议使用 setTimeout() 来轮询元素是否存在于 DOM 中。我发现很难相信这个有问题的解决方案是唯一应该作为回调构建到网格中的方法。

所以我的问题是，是否有可靠的方法来检测刷新后网格 DOM 何时准备就绪？或者，是否有一种方法可以检测每个 TR 元素的创建(一个接一个)？

编辑

添加代码:

var oDataSource =
{
    type : "odata",
    error : function ( oEvent )
    {
        // show error
    },
    transport :
    {
        read :
        {
            url : "http://url.com/...",
            dataType : "json"
        }
    },
    schema :
    {
        data : function ( oData )
        {
            return ( oData["value"] );
        },
        total : function ( oData )
        {
            return ( oData["odata.count"] );
        },
        model :
        {
            fields :
            {
                /* Model definition */
            }
        },
        pageSize : 15,
        serverPaging : true,
        serverFiltering : true,
        serverSorting : true
    }
};

var oGridSettings =
{
    dataSource : oDataSource,
    rowTemplate : kendo.template ( $( "#detail-row-template" ).html () ),
    sortable : true,
    pageable : true,
    columns :
    [
        /* Column definitions */
    ]
};

oDiv.kendoGrid ( oGridSettings );

Answer 1

根据剑道文档

http://docs.kendoui.com/api/framework/datasource#configuration-transport.read

The data source uses jQuery.ajax to make a HTTP request to the remote service. The value configured via transport.read is passed to jQuery.ajax. This means that you can set all options supported by jQuery.ajax via transport.read except the success and error callback functions which are used by the transport.

因此您可以向数据源的transport.read 函数添加一个complete 回调函数，如下所示:

transport :
{
    read :
    {
        url : "http://url.com/...",
        dataType : "json",
        complete: function(data, status) {
            if (status === "success") {
                // your code that will be executed once the request is done
            }
        }
    }
},