easyui树节点拖拽排序的存储过程
2024-08-28 10:31:12
easyui树的拖拽排序功能
easyui树中有拖拽功能
树结构如下:
一个行政区域对应一个单位,一个单位对应多个部门,每个部门下有相关人员,功能要求:
(1)行政区域没有子节点,点击text加载部门;(2)点击部门的text,如果有下级部门则加载部门,没有则加载人员;(3)树都有拖拽排序功能
1、前台页面:
<script type="text/javascript" src = "js/lib/jquery-1.8.0.min.js"></script>
<script type="text/javascript" src = "js/lib/jquery.easyui.min.js"></script>
<div data-options="region:'center'">
<ul id="orgs_tree" class="easyui-tree" ></ul>
</div>
var orgs_tree_default = {
url : 'servlet/SearchServlet?dispatch=0',
animate : true,
onClick:function(node){
var url = "servlet/SearchServlet?dispatch=1";//默认加载地区的树
var isDeptTree = false;
var unit_id ;
//根据行政区划获取单位列表
$.getJSON(url,{regions_id:node.attributes.regions_id},function(data){
if(data.length > ){ }else if(data.length == ){ }else{
//点击部门树的text,加载树
$("#dept_tree").tree({
url:"servlet/SearchServlet?dispatch=2&unit_id=" + unit_id+"&id=0", //默认加载部门的树
onBeforeExpand:function(node,param){
$("#dept_tree").tree("options").url="servlet/SearchServlet?dispatch=2&unit_id=" + unit_id+"&id="+node.id;
},
onSelect:function(node){ //当点击text的时候,展开子节点
$(this).tree("expand",node.target);
}
});
}
});
},
onDrop:function(target, source, point){ //行政区域树的拖拽功能
var node = $("#orgs_tree").tree("getNode",target); // 将DOM对象转换为node
//组装参数
var param = {
//目标节点属性
targetId : node.attributes.regions_id ,
targetSort : node.attributes.regions_sort , //源节点属性
sourceId : source.attributes.regions_id ,
sourceSort : source.attributes.regions_sort, //操作方式3种,append:变更父节点,top:平级-上 bottom:平级-下
point : point}; //更新数据库,这个后台需要用到存储过程
var url = "servlet/ManagerServlet?dispatch=0";
$.post(url,param,function(data){
alert("success");
});
}
};
2、java后台调用方法
最新文章
- 深入浅出node(1) Node简介
- 为了解决mysqlbing翻译表字段问题而分析frm文件(持续更新)
- Android之旅---广播(BroadCast)
- 关于64位WIN7下正确建立JAVA开发环境(转
- UVa 10253 - Series-Parallel Networks
- [转]linux之date命令
- HttpWatch网络抓包工具的使用
- Debian上安装TightVNC Server
- Nodejs进阶:MD5入门介绍及crypto模块的应用
- bzoj 4765 普通计算姬(树状数组 + 分块)
- JAVA多线程之wait/notify
- 要学的东西太多了,还想学习opencv
- python控制流 If-else
- Android远程桌面助手(B1309)
- jdbc 连接各种数据库 CRUD
- Chrome浏览器中autocomplete=";off";不起作用解决方案
- SearchScore
- Vue项目本地run与build后样式不同,build后样式不生效
- setState()之后使用state的问题
- 利用反射创建User类的对象
热门文章
- VS2010在WIN7下安装报错“下列组件安装失败”如何解决
- Codeforces Round #383 【总结】
- unity3d 在UGUI中制作自适应调整大小的滚动布局控件
- 编译keepalived 方法
- springboot2.x 的 RedisCacheManager变化
- 101 Symmetric Tree 判断一颗二叉树是否是镜像二叉树
- [在读] javascript权威指南第六版
- 安卓 使用LruCache 加载图片 遇到的问题
- Eclipse集成Maven环境(出现jar的解析或者缺失问题)(或者出现Invalid classpath publish/export dependency /common. Project entries not supported)的统一整理
- Apache——DBUtils框架ResultSetHandler接口使用