ExtJS+ASP.NET实现Tree节点的拖动(DragDrop)

最新推荐文章于 2013-12-26 16:28:00 发布

weixin_34302798

最新推荐文章于 2013-12-26 16:28:00 发布

阅读量156

点赞数

文章标签： javascript 操作系统数据库 ViewUI

本文介绍如何利用ExtJS和ASP.NET轻松实现TreePanel节点的拖拽功能，包括拖动节点到不同的父节点及调整节点位置等操作，并提供具体实现代码。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

摘要：本文介绍使用ExtJS和Asp.NET实现TreePanel的节点的拖动（Drag&Drop）。例如，拖动节点到另一父节点，插入某节点到另一节点之前/后。

ExtJS+ASP.NET实现Tree节点的拖动(DragDrop)是非常简单的。

首先打开TreePanel的允许DragDrop的选项:

 
var tree = new Ext.tree.TreePanel({ 
   
…//此处省略 
   
enableDD:true, //允许DragDrop 
   
…//此处省略 
   
}) 
  

定义事件：

 
tree.on("dragdrop", treeDragDropHandler); 
   
function treeDragDropHandler(t,node,dd,e){ 
alert(node.id); //源节点id 
alert(node.parentNode.id); //目标父节点id 
alert(node.nextSibling ? node.nextSibling.id : ""); //下一个节点id，用于拖动插入某节点到另一节点之前/后 
alert(node.previousSibling ? node.previousSibling.id : ""); //前一个节点id，用于拖动插入某节点到另一节点之前/后 
//TODO: 此处添加操作，例如保存拖动结果到数据库等! 
   
} 
  