zTree-edit.js 5.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133
  1. <!--
  2. var setting = {
  3. view: {
  4. addHoverDom: addHoverDom,
  5. removeHoverDom: removeHoverDom,
  6. selectedMulti: false
  7. },
  8. edit: {
  9. enable: true,
  10. editNameSelectAll: true,
  11. showRemoveBtn: showRemoveBtn,
  12. showRenameBtn: showRenameBtn
  13. },
  14. data: {
  15. simpleData: {
  16. enable: true
  17. }
  18. },
  19. callback: {
  20. beforeDrag: beforeDrag,
  21. beforeEditName: beforeEditName,
  22. beforeRemove: beforeRemove,
  23. beforeRename: beforeRename,
  24. onRemove: onRemove,
  25. onRename: onRename
  26. }
  27. };
  28. var zNodes =[
  29. { id:1, pId:0, name:"全部", open:true},
  30. { id:11, pId:1, name:"彩页", open:true},
  31. { id:111, pId:11, name:"广东彩页"},
  32. { id:112, pId:11, name:"计量支付"},
  33. { id:12, pId:1, name:"手提袋", open:true},
  34. { id:13, pId:1, name:"手册", open:true},
  35. { id:131, pId:13, name:"广东用户手册"},
  36. { id:132, pId:13, name:"全国用户手册"},
  37. { id:14, pId:1, name:"包装盒", open:true},
  38. { id:15, pId:1, name:"信封", open:true}
  39. ];
  40. var log, className = "dark";
  41. function beforeDrag(treeId, treeNodes) {
  42. return false;
  43. }
  44. function beforeEditName(treeId, treeNode) {
  45. className = (className === "dark" ? "":"dark");
  46. showLog("[ "+getTime()+" beforeEditName ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
  47. var zTree = $.fn.zTree.getZTreeObj("treeDemo");
  48. zTree.selectNode(treeNode);
  49. setTimeout(function() {
  50. if (confirm("进入节点 -- " + treeNode.name + " 的编辑状态吗?")) {
  51. setTimeout(function() {
  52. zTree.editName(treeNode);
  53. }, 0);
  54. }
  55. }, 0);
  56. return false;
  57. }
  58. function beforeRemove(treeId, treeNode) {
  59. className = (className === "dark" ? "":"dark");
  60. showLog("[ "+getTime()+" beforeRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
  61. var zTree = $.fn.zTree.getZTreeObj("treeDemo");
  62. zTree.selectNode(treeNode);
  63. return confirm("确认删除 节点 -- " + treeNode.name + " 吗?");
  64. }
  65. function onRemove(e, treeId, treeNode) {
  66. showLog("[ "+getTime()+" onRemove ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name);
  67. }
  68. function beforeRename(treeId, treeNode, newName, isCancel) {
  69. className = (className === "dark" ? "":"dark");
  70. showLog((isCancel ? "<span style='color:red'>":"") + "[ "+getTime()+" beforeRename ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name + (isCancel ? "</span>":""));
  71. if (newName.length == 0) {
  72. setTimeout(function() {
  73. var zTree = $.fn.zTree.getZTreeObj("treeDemo");
  74. zTree.cancelEditName();
  75. alert("节点名称不能为空.");
  76. }, 0);
  77. return false;
  78. }
  79. return true;
  80. }
  81. function onRename(e, treeId, treeNode, isCancel) {
  82. showLog((isCancel ? "<span style='color:red'>":"") + "[ "+getTime()+" onRename ]&nbsp;&nbsp;&nbsp;&nbsp; " + treeNode.name + (isCancel ? "</span>":""));
  83. }
  84. function showRemoveBtn(treeId, treeNode) {
  85. return !treeNode.isFirstNode;
  86. }
  87. function showRenameBtn(treeId, treeNode) {
  88. return !treeNode.isLastNode;
  89. }
  90. function showLog(str) {
  91. if (!log) log = $("#log");
  92. log.append("<li class='"+className+"'>"+str+"</li>");
  93. if(log.children("li").length > 8) {
  94. log.get(0).removeChild(log.children("li")[0]);
  95. }
  96. }
  97. function getTime() {
  98. var now= new Date(),
  99. h=now.getHours(),
  100. m=now.getMinutes(),
  101. s=now.getSeconds(),
  102. ms=now.getMilliseconds();
  103. return (h+":"+m+":"+s+ " " +ms);
  104. }
  105. var newCount = 1;
  106. function addHoverDom(treeId, treeNode) {
  107. var sObj = $("#" + treeNode.tId + "_span");
  108. if (treeNode.editNameFlag || $("#addBtn_"+treeNode.tId).length>0) return;
  109. var addStr = "<span class='button add' id='addBtn_" + treeNode.tId
  110. + "' title='add node' onfocus='this.blur();'></span>";
  111. sObj.after(addStr);
  112. var btn = $("#addBtn_"+treeNode.tId);
  113. if (btn) btn.bind("click", function(){
  114. var zTree = $.fn.zTree.getZTreeObj("treeDemo");
  115. zTree.addNodes(treeNode, {id:(100 + newCount), pId:treeNode.id, name:"new node" + (newCount++)});
  116. return false;
  117. });
  118. };
  119. function removeHoverDom(treeId, treeNode) {
  120. $("#addBtn_"+treeNode.tId).unbind().remove();
  121. };
  122. function selectAll() {
  123. var zTree = $.fn.zTree.getZTreeObj("treeDemo");
  124. zTree.setting.edit.editNameSelectAll = $("#selectAll").attr("checked");
  125. }
  126. $(document).ready(function(){
  127. $.fn.zTree.init($("#treeDemo"), setting, zNodes);
  128. $("#selectAll").bind("click", selectAll);
  129. });
  130. //-->