easyui树拖拽排序java_ztree使用系列四(ztree实现同级拖拽排序并将排序结果保存数据库)...

本文介绍了如何使用ZTree实现同级节点间的拖拽排序功能,并详细讲解了JSP、Controller、Service和Mapper层的实现代码,以将排序结果保存到数据库。拖拽前和拖拽释放后的JavaScript函数以及Ajax交互过程也被详细阐述。
摘要由CSDN通过智能技术生成

ztree这个系列的最后一篇,也是ztree功能强大的体现之中的一个——排序功能。

ztree能够实现全部节点之间任意的拖拽排序功能。我这里依据须要实现了仅仅同意同级之间任意拖拽排序,事实上原理都一样,仅仅是范围缩小了一些,多了一些推断而已。以下是每一层的代码。还是採取仅仅贴出功能代码。由于这个拖拽排序功能我感觉非常不错,所以单独拿出一篇博客来展示,也方便理解。

Jsp页面实现功能的js代码例如以下:

//拖拽前运行

var dragId;

function beforeDrag(treeId, treeNodes) {

for (var i=0,l=treeNodes.length; i

dragId = treeNodes[i].pId;

if (treeNodes[i].drag === false) {

return false;

}

}

return true;

}

//拖拽释放之后运行

function beforeDrop(treeId, treeNodes, targetNode, moveType) {

if(targetNode.pId == dragId){

var data = {id:treeNodes[0].id,targetId:targetNode.id,moveType:moveType};

var confirmVal = false;

$.ajax({

async: false,

type: "post",

data:data,

url:"/library/updateLibrarySort/ ",

success: function(json){

if(json=="success" ){

confirmVal = true;

alert('操作成功!');

} else{

alert('亲,操作失败');

}

},

error: function(){

alert('亲,网络有点不给力呀。');

}

});

return confirmVal;

} else{

alert('亲,仅仅能进行同级排序!

');

return false;

}

}

Controller层代码例如以下:

/**

* 更新分类排序

* @return

*/

@RequestMapping(value="updateLibrarySort/")

@ResponseBody

public String updateLibrarySort(HttpServletRequest request, HttpServletResponse response,LibraryVo libraryVo) {

String createname=(String) request.getSession().getAttribute(Constants.CURRENT_USER_NAME);

return libraryService.updateLibrarySort(libraryVo,createname);

}

service层代码例如以下:

/**

* 更新排序

* @return

*/

public String updateLibrarySort(LibraryVo libraryVo,String userName){

int numFlag = 0;

Library libraryT = libraryMapper.selectByPrimaryKey(libraryVo.getTargetId());//目标分类信息

Library library = libraryMapper.selectByPrimaryKey(libraryVo.getId());//拖动分类信息

library.setTarget_order_id(libraryT.getOrder_id());

library.setUpdate_time(new Date());//设置时间

library.setUpdate_user(userName);//设置操作人

libraryT.setUpdate_time(new Date());//设置时间

libraryT.setUpdate_user(userName);//设置操作人

Map libraryMap = new HashMap();//參数集合

if (libraryVo.getMoveType().equals("prev")) {//向前移动

libraryMap.put("pid", library.getPid());

libraryMap.put("order_id", library.getTarget_order_id());

libraryMap.put("target_order_id", library.getOrder_id());

List listLibraryFlag = libraryMapper.findLibraryListByOrderId(libraryMap);

int order_id = libraryT.getOrder_id() + 1;

library.setOrder_id(libraryT.getOrder_id());

libraryT.setOrder_id(order_id);

for (int i = 0; i < listLibraryFlag.size(); i++) {//更新全部受影响的排序字段

Library ly = listLibraryFlag.get(i);

if(!(ly.getId()).equals(library.getId()) && !(ly.getId()).equals(libraryT.getId())){

ly.setUpdate_time(new Date());

ly.setUpdate_user(userName);

ly.setOrder_id(ly.getOrder_id()+1);

libraryMapper.updateOrderId(ly);//更新其它受影响的分类信息

}

}

libraryMapper.updateOrderId(library);//更新拖动分类信息

numFlag = libraryMapper.updateOrderId(libraryT);//更新目标分类信息

}else if(libraryVo.getMoveType().equals("next")){//向后移动

libraryMap.put("pid", library.getPid());

libraryMap.put("order_id", library.getOrder_id());

libraryMap.put("target_order_id", library.getTarget_order_id());

List listLibraryFlag = libraryMapper.findLibraryListByOrderId(libraryMap);

int order_id = libraryT.getOrder_id();

library.setOrder_id(order_id);

libraryT.setOrder_id(order_id - 1);

for (int i = 0; i < listLibraryFlag.size(); i++) {//更新全部受影响的排序字段

Library ly = listLibraryFlag.get(i);

if(!(ly.getId()).equals(library.getId()) && !(ly.getId()).equals(libraryT.getId())){

ly.setUpdate_time(new Date());

ly.setUpdate_user(userName);

ly.setOrder_id(ly.getOrder_id() - 1);

libraryMapper.updateOrderId(ly);//更新其它受影响的分类信息

}

}

libraryMapper.updateOrderId(library);//更新拖动分类信息

numFlag = libraryMapper.updateOrderId(libraryT);//更新目标分类信息

}else{

//

}

return ServiceUtil.ReturnString(numFlag);

}

Mapper层代码例如以下

/**

* 依据pid、order_id和target_order_id查询全部受影响的信息

* @param pid

* @param order_id

* @param target_order_id

* @return

*/

public List findLibraryListByOrderId(Map library);

/**

* 更新

* @param library

* @return

*/

public int updateOrderId(Library library);

相应的xml代码例如以下:

< sql id= "Base_Column_List" >

id, pid , name, create_time, update_time, is_delete, update_user, create_user, level_id,

order_id

sql>

< update id= "updateOrderId" parameterType="Library" >

update onair_vms_library

update_time = #{update_time},

update_user = #{update_user},

order_id = #{order_id}

where id = #{id}

update>

< select id= "findLibraryListByOrderId" resultMap= "BaseResultMap" parameterType ="java.util.Map" >

select

from onair_vms_library

where order_id between #{order_id} and #{target_order_id} and pid = #{ pid}

select>

写的一般,不正确的地方欢迎指正,有高效或者更加简便的办法希望可以共享一下,尤其是在排序功能运行保存的时候假设可以不使用循环一条sql能搞定就更加强大了。欢迎大家指点。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值