禁用 Kendo-UI TreeView 节点

Question

我有一个 TreeView，当某些节点的数据中包含 state_current != null 时，我想禁用它们，就像 demo 中的“禁用节点”按钮一样。

我的代码是：

<script>
    $(document).ready(function() {

        var treeview = $('#Tree_view').kendoTreeView({
            template: "#= item.name #",
            dataSource: Parcours,
            dataTextField: 'name',
            loadOnDemand: true,
            expand: onExpandedItem
        });
    });

    function onExpandedItem(e) {

        var id_user = @Model.id;

        var item =  $('#Tree_view').data('kendoTreeView').dataItem(e.node)

        var type = item.fields.type;

        if (item.level() > 0) {
            item.id_parcours = item.parentNode().id_parcours;
            if (item.level() == 2) {
                item.id_promo = item.parentNode().id;
            }
        }
        else item.id_parcours = item.Id;

        switch (type) {
            case 'parcours':
                item.children.transport.options.read = {
                    url: '@Url.Action("Get_Session", "Users")' + '?user_id=' + id_user,
                    dataType: "json",
                };
                break;

            case 'session':
                item.children.transport.options.read = {
                    url: '@Url.Action("Get_Matiere")' + '?user_id=' + id_user,
                    dataType: "json"
                };
                break;

            default:
                break;
        }
    }

    var Matiere = {
        transport: {
            read: {
                url: '@Url.Action("Get_Matiere")',
                type: 'GET',
                dataType: 'json'
            }
        },
        schema: {
            model: {
                fields: {
                    name: 'Name',
                    type: 'matiere'
                },
                hasChildren: false,
            }
        }
    }

    var Session = {
        transport: {
            read: {
                url: '@Url.Action("Get_Session")',
                type: 'GET',
                dataType: 'json'
            }
        },
        schema: {
            model: {
                fields: {
                    id: 'IdPromo',
                    name: 'NamePromo',
                    type: 'session',
                    date: 'Date',
                    state: 'State_current',
                },
                hasChildren: true,
                children: Matiere
            }
        }
    }

    var Parcours = {
        transport: {
            read: {
                url: '@Url.Action("Get_Parcours", "Users")',
                data: {user_id: @Model.id},
                type: 'GET',
                dataType: 'json'
            }
        },
        schema: {
            model: {
                fields: {
                    id: 'Id',
                    name: 'Name',
                    type: 'parcours'
                },
                hasChildren: true,
                children: Session
            }
        }
    };
</script>

Answer 1

在您要禁用节点的地方执行此操作

var selectedNode = treeview.select();
    treeview.enable(selectedNode, false);

这里的树视图应该是你的树视图对象，一旦创建树视图，你可以如下选择它。您可以提供需要禁用的节点，而不是 selectedNode。

var treeview = $('#Tree_view').data("kendoTreeView");

如果您想在树视图首先呈现时执行此操作，您可以在 kendoTreeView 数据绑定事件中进行检查，或者如果您希望在选择时在选择事件中进行检查。