ztree.js 如何实现树结构程序的实时存储,通过和后端一番的探讨后,最终定下了在触发拖动的时候调用接口存储同级下的节点程序,并且只能同级拖动:
function beforeDrop(treeId, treeNodes, targetNode, moveType) { var moveNode = treeNodes[0]; switch (moveType) { case "prev": case "next": if (moveNode.parentId == targetNode.parentId) { //只能同级拖动 return true; } break; // case "inner": // if (moveNode.parentId == targetNode.parentId) { // return true; // } // break; } return false; } function singleCick(event, tree, treeNode) { var nodes = treeObj.getSelectedNodes(); //设置父节点不能被抉择 if (tree.children) { return false; } if (nodes.length > 0) { treeNodeData = nodes[0]; } } //保留节点的排序程序 function saveNodesSort(currNode) { var currLevelNodes = currNode.getParentNode().children; //获取同级的所有节点 var currLevelNodesIds = currLevelNodes && currLevelNodes.map(function (item, idx) { return item.id; }); $.ajax({ url: "/savesort.api", method: "get", data: { ids: currLevelNodesIds.join(), }, success: function (res) { if (res.code == 0) { console.log("排序保留胜利"); } }, error: function (res) { layer.msg(res.desc); }, }); } var setting = { callback: { onClick: zTreeOnClick, beforeClick: singleCick, beforeDrop: beforeDrop, onDrop: function ( event, treeId, treeNodes, targetNode, moveType, isCopy ) { //拖动实现保留程序 saveNodesSort(treeNodes[0]); }, beforeRemove: function (treeId, treeNode) { var zTree = $.fn.zTree.getZTreeObj(treeId); layer.confirm( "是否删除" + treeNode.name+",删除后无奈复原", { btn: ["确定", "勾销"], }, function (index) { zTree.removeNode(treeNode); layer.close(index); deleteNode(treeNode.id); } ); return false; }, }, view: { selectedMulti: false, }, edit: { enable: true, showRemoveBtn: function (treeId, treeNode) { //父节点不显示删除按钮 return !treeNode.isParent; }, showRenameBtn: false, drag: { prev: true, next: true, inner: false, isCopy: false, isMove: true, }, }, }; var ztreeObj = $.fn.zTree.init($("#treeDemo"), setting, [treeData]);