Kendo UI TreeView 可以定义托拽事件,代码如下:
$("#treeview").kendoTreeView({
checkboxes: false,
dragAndDrop: true,
dataSource: dataSource,
dataTextField: "Label",
select: onSelect,
drop: function (e) {
var treeview = $("#treeview").data("kendoTreeView");
e.setValid(e.dropPosition == "over");
if (e.valid) {
var dataItemS = treeview.dataItem(e.sourceNode);
var dataItemT = treeview.dataItem(e.destinationNode);
var dto = {
targetRootId: dataItemT.Id,
movedId: dataItemS.Id
};
...
}
}
});
如果在某些情况下,需要取消托拽,可以通过e.setValil(false)实现,比如上面的代码中,如果只希望通过托拽移动子节点到父节点,可以设置:
e.setValid(e.dropPosition == "over");
这样如果e.dropPosition是after或者before,就不会起作用。
还有一种情况,可以弹出提示框,提示用户是否进行托拽处理,代码如下:
function onDrop(e) {
e.setValid(confirm('Do you wish to move this item here?'));
}
网友评论