Question

我正在使用来自KendoUI的TreeList，我有一个包含刻度/交叉图像的列。到目前为止，我已将其设置为在单击一行时切换刻度/交叉，并切换所选节点上的直接子节点。我找到了一种方法来切换所有3级深度的孩子（在剑道页面的例子中，这将是从Daryl到Buffy）。

然而，由于我将使用最多8级深度的TreeLists，可能更多。我需要切换所选节点的所有子节点的tick / cross，无论它的深度是多少。

下面是我目前使用的代码，我不认为添加8个for和if语句是最好的方法。

 $('#treelist td[role="gridcell"]').click(function(e) {

var treelist = $('#treelist').data("kendoTreeList");

if($(this).has("img[src='greentick.png']").length > 0) {
    $(this).find('img').attr("src","redcross.png");

    var selectedRow = treelist.select();
    var dataItem = treelist.dataItem(selectedRow);
    var rowID = dataItem.id;

    var data = treelist.dataSource.data(); //Array of all data rows
    var children = [];
    console.log(data);

    for(var i = 0; i < data.length; i++) {

        var parentID = data[i].parentId;
        if(parentID == rowID) { //If this row is a child of the selected row
            children.push(data[i].id);
            data[i].working = "<img src='redcross.png' />";

            if(data[i].hasChildren) {
                var childParentID = data[i].id;  //Parent ID to check against child nodes of current node

                for(var j = i; j < (data.length - i); j++) {

                    if(data[j].parentId == childParentID) {
                        data[j].working = "<img src='redcross.png' />";
                    }
                }
            }
        }       
    }
    treelist.refresh();

} else if($(this).has("img[src='redcross.png']").length > 0) {
    $(this).find('img').attr("src","greentick.png");
}

});

作为参考，这是Treelist返回的数组中的单个dataItem（在我的情况下是var数据）。 var data包含一个数组，其中包含每行的数组。

Name: "Daryl Sweeney"
Phone: "(555) 924-9726"
Position: "CEO"
_events: Object
_loaded: true
dirty: false
hasChildren: true
id: 1
parent: ()
parentId: null
uid: "16a87dbd-8ddf-41f4-b69e-38822a527deb"
working: "<img src='greentick.png' id='test' />"
__proto__: i.extend.i

Kendo UI TreeList选择所有子节点

0 个答案: