您的位置:首页 > 产品设计 > UI/UE

easyUI 拖动(Drag)和放置(Drop)Tree

2012-08-13 11:07 183 查看
@author YHC

当使用tree插件在一个应用,drag(拖拽) 和 drop(放置)功能是必须允许用户改变节点位置,启用drag
和 drop 操作,所有你需要做的就是为tree插件设置 'dnd'属性为true.




创建 Tree

$('#tt').tree({
dnd: true,
url: 'tree_data.json'
});
当放置成功在一个tree节点, 'onDrop' 事件将被触发,你应该做一些或更多的操作,例如保存节点状态到远程服务器端,等等..

onDrop: function(targetNode, source, point){
var targetId = $(target).tree('getNode', targetNode).id;
$.ajax({
url: '...',
type: 'post',
dataType: 'json',
data: {
id: source.id,
targetId: targetId,
point: point
}
});
}


下载 EasyUI  示例代码:

easyui-tree-demo.zip
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息