FineUI 官方论坛

标题: FineUI树控件节点拖放插件 [打印本页]

作者: 棕榈    时间: 2019-12-23 20:24
标题: FineUI树控件节点拖放插件
本帖最后由 棕榈 于 2019-12-23 20:23 编辑

[attach]12173[/attach]
拖放效果参考了easyui

使用方法:
将 fineui-tree-node-drag-drop.js 文件放入项目中并引用到页面

示例代码

  1. @section script{
  2.     <script src="~/res/js/fineui-tree-node-drag-drop.js"></script>
  3.     <script>
  4.         F.ready(function () {
  5.             F.ext.treeNodeDragDrop({
  6.                 treeId: "Tree1",

  7.                 // 放置之前的操作,返回值为boolean,true表示可以放置,否则不可以放置
  8.                 // 不定义表示不对节点的拖放进行控制
  9.                 beforeDrop: beforeDrop,

  10.                 // 节点放置成功后的操作
  11.                 afterDrop: afterDrop
  12.             });
  13.         });

  14.         function beforeDrop(droppedData) {
  15.             // 拖放的节点
  16.             var dragNodeId = droppedData.dragNodeId;

  17.             // 目标节点
  18.             var targetNodeId = droppedData.targetNodeId;

  19.             // 位置:before,append,after
  20.             var position = droppedData.position;
  21.             if (position === "append") {
  22.                 // 允许放置
  23.                 return true;
  24.             }

  25.             // 不允许放置
  26.             return false;
  27.         }

  28.         function afterDrop(droppedData) {
  29.             alert(droppedData.dragNodeId + "," + droppedData.targetNodeId + "," + droppedData.position);
  30.         }
  31.     </script>
  32. }
复制代码

js文件及源码可到知识星球下载。
源码采用typescript编写,并用webpack打包



作者: 消失的键盘    时间: 2020-3-11 16:31
亲,不知道是不是有个小BUG 。如果是从后台赋值到NodeID,如果 int,则无法实现移动的效果,也就是说 NodeID必须是带双引号的值,例如 "123"




欢迎光临 FineUI 官方论坛 (https://fineui.com/bbs/) Powered by Discuz! X3.4