可編輯的樹

時間 2019-11-06

標籤編輯简体版

原文原文鏈接

即時編輯

實現代碼以下詳細參見http://www.360ui.net： ajax

var setting1 = { app

view: { ui

addHoverDom: addHoverDom, this

removeHoverDom: removeHoverDom, spa

selectedMulti: false .net

}, ci

edit: { rem

enable: true, get

renameTitle:"修改", it

removeTitle:"刪除"

callback: {

//不容許拖拽

beforeDrag: beforeDrag1,

//修改前確認

beforeEditName: beforeEditName1,

//修改完時的處理

beforeRename: beforeRename1,

//修改爲功後處理

onRename: onRename1,

//刪除前確認

beforeRemove: beforeRemove1

}

};

var zNodes1 =[

{ id:1, parentId:0, name:"父節點 1", open:true},

{ id:11, parentId:1, name:"葉子節點 1-1"},

{ id:12, parentId:1, name:"葉子節點 1-2"},

{ id:13, parentId:1, name:"葉子節點 1-3"},

{ id:2, parentId:0, name:"父節點 2", open:true},

{ id:21, parentId:2, name:"葉子節點 2-1"},

{ id:22, parentId:2, name:"葉子節點 2-2"},

{ id:23, parentId:2, name:"葉子節點 2-3"},

{ id:3, parentId:0, name:"父節點 3", open:true},

{ id:31, parentId:3, name:"葉子節點 3-1"},

{ id:32, parentId:3, name:"葉子節點 3-2"},

{ id:33, parentId:3, name:"葉子節點 3-3"}

];

function initComplete(){

$.fn.zTree.init($("#tree-1"), setting1, zNodes1);

}

function beforeDrag1(treeId, treeNodes) {

return false;

}

//確認是否進入編輯狀態

function beforeEditName1(treeId, treeNode) {

var zTree = $.fn.zTree.getZTreeObj("tree-1");

//選中該節點

zTree.selectNode(treeNode);

zTree.editName(treeNode);

return true;

}

//修改完時處理不進行後臺數據處理

function beforeRename1(treeId, treeNode, newName) {

if (newName.length == 0) {

top.Dialog.alert("節點名稱不能爲空.");

var zTree = $.fn.zTree.getZTreeObj("tree-1");

setTimeout(function(){zTree.editName(treeNode)}, 10);

return false;

}

return true;

}

//修改爲功後處理

function onRename1(event, treeId, treeNode) {

//此處進行ajax後臺數據處理

}

//確認是否刪除+刪除處理

function beforeRemove1(treeId, treeNode) {

var zTree = $.fn.zTree.getZTreeObj("tree-1");

//選中該節點

zTree.selectNode(treeNode);

top.Dialog.confirm("確認刪除節點 -- " + treeNode.name + " 嗎？",function(){

zTree.removeNode(treeNode);

//此處進行ajax後臺數據處理

});

return false;

}

//添加新增按鈕

var newCount = 1;

function addHoverDom(treeId, treeNode) {

if (treeNode.editNameFlag || $("#addBtn_" + treeNode.id).length > 0) return;

var sObj = $("#" + treeNode.tId + "_span");

var addStr = "<button type='button' class='add' id='addBtn_" + treeNode.id + "' title='添加' onfocus='this.blur();'></button>";

sObj.append(addStr);

var btn = $("#addBtn_" + treeNode.id);

if (btn){

btn.bind("click", function(){

var zTree = $.fn.zTree.getZTreeObj("tree-1");

var newNode;

newNode = zTree.addNodes(treeNode, {id:(100 + newCount), parentId:treeNode.id, name:"新增" + (newCount++)});

if (newNode) {

zTree.editName(newNode[0]);

}

return false;

});

}

};

function removeHoverDom(treeId, treeNode) {

$("#addBtn_" + treeNode.id).unbind().remove();

};

相關標籤/搜索

每日一句

每一个你不满意的现在，都有一个你没有努力的曾经。