Ext tree 动态生成、拖动排序、右键菜单
我仅提供了一种方法，还会有很多实现的方法，不多说上代码！
test_tree.js
Ext.onReady(function() { var Tree = Ext.tree; var loader = new Tree.TreeLoader({ dataUrl: 'test.aspx', listeners: { "beforeload": function(treeLoader, node) { treeLoader.baseParams.id = (node.id != "root" ? node.id : ""); } } }); var tree = new Tree.TreePanel({ el: 'tree-div', useArrows: true, autoScroll: true, animate: true, enableDD: true, containerScroll: true, loader: loader, listeners: { "click": function(node) { alert(node.id); } }, "contextmenu": function(node, e) { //点击右键出现tree菜单 node.select();//点击右键同时选中该项 e.preventDefault(); var treeMenu = new Ext.menu.Menu ([ { text: "修改", iconCls: "bedit", pressed: true, handler: function() { edit_win(node.id); } }, { text: "删除", iconCls: "bdelete", pressed: true, handler: function() { del_sx(node.id, node); } } ]); //定位菜单的显示位置 treeMenu.showAt(e.getPoint()); }, "movenode": function(tree, node, oldNode, newNode, index) { //当拖动时的操作 var nid = node.id; var oldnid = oldNode.id; var newnid = newNode.id; var nindex = index; Ext.Ajax.request({ url: '../ajax/s/s_operate.aspx', method: "POST", params: { t: 'sort', nid: nid, oldnid: oldnid, newnid: newnid, nindex: nindex}, success: function(response, options) { var d = Ext.decode(response.responseText); if (d.success == true) { // alert(d.value); parent.Ext.MessageBox.hide(); } else { msg("提示信息", "" + d.value + ""); } }, failure: function() { msg("提示信息", "服务器连接失败!"); } }); } }); //拖动排序是顺序显示 new Ext.tree.TreeSorter(tree1, { // folderSort: true, // dir: 'asc', sortType: function(node) { return parseInt(node.attributes.sortIndex, 0); } }); var root = new Tree.AsyncTreeNode({ text: 'test', draggable: false, id: 'root' }); tree.setRootNode(root); tree.render(); root.expand(); }); function del_sx(prid, trNode) { parent.Ext.Msg.confirm("删除提示", "您确定要删除吗？", function(btn) { if (btn == 'yes') { parent.Ext.MessageBox.show ( { title: '正在删除中...', msg: '正在删除，请稍等...', progressText: '删除中...', width: 300, wait: true, waitConfig: { interval: 200, duration: 2000, fn: function() { Ext.Ajax.request({ url: '../ajax/s/s_operate.aspx', method: "POST", params: { t: "del", prid: prid }, success: function(response, options) { var d = Ext.decode(response.responseText); if (d.success == true) { removeChildNodes(trNode); parent.Ext.MessageBox.hide(); } else { msg("提示信息", "" + d.value + ""); } }, failure: function() { msg("提示信息", "服务器连接失败!"); } }); } }, icon: 'DeleteLoad', animEl: 'saving' } ); } }); } //删除节点 function removeChildNodes(node) { while (node.firstChild) { removeChildNodes(node.firstChild); } if (node.getDepth() != "0") { node.remove(); } }
test_shuju.aspx
<% String node = Request["node"]; String json = ""; if ("root".Equals(node)) { json += "[{id:1,text:'节点1','leaf':false},{id:3,text:'节点2','leaf':false}]"; } else if ("1".Equals(node)) { json += "[{id:11,text:'节点11',leaf:false},{id:2,text:'节点12',leaf:true}]"; } else if ("2".Equals(node)) { json += "[{id:21,text:'节点21',leaf:true},{id:22,text:'节点22',leaf:true}]"; } else if ("3".Equals(node)) { json += "[{id:111,text:'节点111',leaf:true},{id:112,text:'节点112',leaf:true}]"; } Response.Write(json); %>
