Kendo UI TreeView:如何避免将节点重新放入其父节点?

时间:2015-03-01 06:23:22

标签: kendo-ui kendo-treeview

以下代码段禁用在特定条件下删除节点。禁止将节点删除到其父节点的条件是什么? (即节点未移动)。默认情况下,TreeView允许此行为。

<div id="treeview"></div>
<script>
$("#treeview").kendoTreeView({
   dragAndDrop: true,
   dataSource: [
       { text: "foo", items: [
          { text: "bar" },
          { text: "baz" }
        ] }
   ]
});

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

treeview.bind("drag", function(e) {

   if (condition1 == false) {
     // deny the drop
     e.setStatusClass("k-denied");
   }

});
</script>

1 个答案:

答案 0 :(得分:0)

如果您只需要阻止在其父级上拖动它,则可以将条件实现为:

// Get reference to target item
var tgt = this.dataItem(e.dropTarget);
// Get reference to parent item of the one being dragged
var parent = this.dataItem(this.parent(e.sourceNode));
// If they have the same uid then they are the same and condition should be false
    var condition1 = (parent.uid === tgt.uid);
    if (condition1 == true) {
      // deny the drop
      e.setStatusClass("k-denied");
    }

请在此处查看:

&#13;
&#13;
$(document).ready(function() {
  $("#treeview").kendoTreeView({
    dragAndDrop: true,
    dataSource: [
      { text: "foo", items: [
        { text: "bar" },
        { text: "baz" }
      ] }
    ]
  });

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

  treeview.bind("drag", function(e) {
    var tgt = this.dataItem(e.dropTarget);
    var parent = this.dataItem(this.parent(e.sourceNode));
    console.log(parent.uid, tgt.uid, parent.uid === tgt.uid);
    var condition1 = (parent.uid !== tgt.uid);
    if (condition1 == false) {
      // deny the drop
      e.setStatusClass("k-denied");
    }

  });
});
&#13;
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2014.3.1411/styles/kendo.default.min.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2014.3.1411/js/kendo.all.min.js"></script>

<div id="treeview"></div>
&#13;
&#13;
&#13;