首页 > 解决方案 > 如何在不折叠的情况下禁用所有 Kendo TreeView 节点

问题描述

我将 kendo.ui.TreeView 用于 jQuery。我用复选框和子对象创建了树:

$("#my-tv-1").kendoTreeView({
  dataSource: data,
  checkboxes: {
    checkChildren: true
  },
  loadOnDemand: false
}).data("kendoTreeView");

let data = [
  { text: "Item 1", id: 1 },
  { text: "Item 2", id: 2 },
  { 
    text: "Item 3", expanded: true, items: [
      { text: "Subitem 1", id: 10 }
    ]
  }
];

如何在没有折叠节点的情况下禁用所有节点(或所有树视图)?当我使用“启用”方法时,所有具有子元素并已展开的节点都会折叠。

function() {
  let treeview = $("#my-tv-1").data("kendoTreeView");

  // Disable all items
  treeview.enable(false);

  // or any node
  let n = treeview.dataSource.view()[2];
  treeview.enable(n, false);
}

标签: javascriptkendo-uikendo-treeview

解决方案


要禁用,您可以执行以下操作,以便展开的节点不会折叠:

treeview.element.find('input.k-checkbox').each(function() {
    $(this).attr('disabled', 'true');
});

treeview.element.find('span.k-in').each(function() {
    $(this).addClass('k-state-disabled');
});

treeview.element.find('span.k-i-collapse').each(function() {
    $(this).addClass('k-state-disabled');
});

要重新启用它们:

treeview.enable(true);

推荐阅读