嘿,我正在尝试禁用treeview中的拖放功能(因为用户将无法在treeview中的任何位置移动任何项目)。然而,我并没有提出解决这个问题的办法。我仍然希望用户能够将treeview中的项目拖放到我的listview框,并将其拖放回treeview框。那么,当从树视图中拖放到我的列表框时,是否可以禁用树视图中的拖放功能?
rggaifut1#
一个选项是,如果您确定删除操作正在树视图中删除,则取消删除操作。该功能仍适用于列表框:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Untitled</title> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.2.616/styles/kendo.common.min.css"> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.2.616/styles/kendo.rtl.min.css"> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.2.616/styles/kendo.default.min.css"> <link rel="stylesheet" href="https://kendo.cdn.telerik.com/2021.2.616/styles/kendo.mobile.all.min.css"> <script src="https://code.jquery.com/jquery-1.12.3.min.js"></script> <script src="https://kendo.cdn.telerik.com/2021.2.616/js/angular.min.js"></script> <script src="https://kendo.cdn.telerik.com/2021.2.616/js/jszip.min.js"></script> <script src="https://kendo.cdn.telerik.com/2021.2.616/js/kendo.all.min.js"></script></head> <body> <div id="treeview-left"></div> <select id="optional" ></select> <script> $("#treeview-left").kendoTreeView({ dragAndDrop: true, drop: onDrop, dataSource: [ { id: 1, text: "Furniture", expanded: true, items: [ { id: 2, text: "Tables & Chairs" }, { id: 3, text: "Sofas" }, { id: 4, text: "Occasional Furniture" } ] }, { id: 5, text: "Decor", items: [ { id: 6, text: "Bed Linen" }, { id: 7, text: "Curtains & Blinds" }, { id: 8, text: "Carpets" } ] } ] }); $("#optional").kendoListBox({ dataTextField: "text", dataValueField: "id", dataSource: [{ id: 8, text: "Other products" }] }); function onDrop(e){ if ($(e.destinationNode).closest('.k-treeview').length) { e.preventDefault(); return false; } var item = e.sender.dataItem(e.sourceNode); var listbox = $('#optional').data('kendoListBox'); listbox.add(item) if(item.hasChildren){ for(var p=0; p <item.items.length;p++){ listbox.add(item.items[p]) } } } </script> </body> </html>
道场诀窍是:
if ($(e.destinationNode).closest('.k-treeview').length) { e.preventDefault(); return false; }
但是,该界面仍然显示了在树状视图中掉落的可能性,这是唯一的缺点。
1条答案
按热度按时间rggaifut1#
一个选项是,如果您确定删除操作正在树视图中删除,则取消删除操作。该功能仍适用于列表框:
道场
诀窍是:
但是,该界面仍然显示了在树状视图中掉落的可能性,这是唯一的缺点。