我有2个剑道树视图; 1个不带复选框,另一个1个带复选框like example here。可以说我想在第二个树形视图上禁用某些节点,当我在第一个树形视图上选择某个节点时禁用带有复选框的树形视图(例如,当我选择家具时,我想禁用不是家具的节点)。该过程有点像example here,但没有按钮,只是选择了第一个树视图上的节点。我该如何实现?
TreeList有一个名为select
的事件,可以为您处理该行为:
select
select: function(e) {
let tv = $("#treeview-right").data("kendoTreeView"), // Gets the 2dn treeview reference
text = e.sender.dataItem(e.node).text; // Gets the 1st treeview selected text
// Iterates over the 2nd treeview items
tv.items().toArray().forEach(item => {
let dataItem = tv.dataItem(item), // Get the item related dataItem
disabled = (dataItem.type !== text); // Figures out if the current item is of selected type
// Gets the current item's checkbox
$(item).find('input[type="checkbox"]')
.prop('checked', false) // Uncheck it by default
.prop('disabled', disabled); // Disable/enable based on above condition
});
}
替代:您可以像下面那样过滤第二个TreeView:
Dojo
select: function(e) {
let tv = $("#treeview-right").data("kendoTreeView"),
text = e.sender.dataItem(e.node).text;
tv.dataSource.filter({ field: "type", operator: "eq", value: text });
}