Question

如何获得Kendo UI Web TreeView中已选中复选框的列表？我无法在API中的任何地方找到此功能，但我认为这将是一个非常基本的操作..

Answer 1

实际上没有API方法，但您可以使用jQuery轻松获取它们。

要选中复选框，请使用

$('#treeviewName :checked');

要使已选中的容器 li 元素使用：

$('#treeviewName :checked').closest('li');

获得 li 元素后，您可以将其传递给TreeView的dataItem方法，并获取基础模型，从而获取其ID或其他属性。

Answer 2

在Kendo演示中，他们提供以下算法：

    // function that gathers IDs of checked nodes
    function checkedNodeIds(nodes, checkedNodes) {
        for (var i = 0; i < nodes.length; i++) {
            if (nodes[i].checked) {
                checkedNodes.push(nodes[i].id);
            }

            if (nodes[i].hasChildren) {
                checkedNodeIds(nodes[i].children.view(), checkedNodes);
            }
        }
    }

    // show checked node IDs on datasource change
    function onCheck() {
        var checkedNodes = [],
            treeView = $("#treeview").data("kendoTreeView"),
            message;

        checkedNodeIds(treeView.dataSource.view(), checkedNodes);

        if (checkedNodes.length > 0) {
            message = "IDs of checked nodes: " + checkedNodes.join(",");
        } else {
            message = "No nodes checked.";
        }

        $("#result").html(message);
    }

Answer 3

来自Gathering the checked nodes from a treeview：

var treeview = $("#treeview").data("kendoTreeView");
var checkedNodes = [];

function gatherStates(nodes) {
    for (var i = 0; i < nodes.length; i++) {
        if (nodes[i].checked) {
            checkedNodes.push(nodes[i].id);
        }

        if (nodes[i].hasChildren) {
           gatherStates(nodes[i].children.view());
        }
    }
}

gatherStates(treeview.dataSource.view());

这似乎没有考虑通过级联检查的未扩展节点：checkChildren属性。

获取Kendo UI Web TreeView中的复选框列表

3 个答案: