ztree 新增、回显demo

1.新增：

     jsp:

          

< div class = "cl row mt-15" >

                        < label for = "" class = "form-label col-xs-3 text-r" >

                            分管部门：

                        </ label >

                        < div class = "formControls col-xs-8 menuContent" id = "menuContent" >

                             < ul id = "treeDemo" class = "ztree" style =" margin-top : 0 ; width : 100% ; height : auto ;" ></ ul >

                         </ div >

                     </ div >

                     < input type = "hidden" id = "groupId" >

js:

function dept_add(){

    $( "#dept_add" ).modal( "show" );

    $.ajax({

        url : bPath + '/manager/depts/orgTree.hrm' ,

        type : 'post' ,

        dataType : 'json' ,

        data : {

            

        },

        success : function (data){

             var setting = {

                     view: {

                         selectedMulti: false

                     },

                     check: {

                         enable: true ,

                         //chkStyle: "radio",设置为单选

                         //radioType: "all"

                     },

                     data: {

                         simpleData: {

                             enable: true

                         }

                     },

                     edit: {

                         enable: false

                     },

                     callback: {

                         onCheck: onCheck

                         }

                    };

                    

                     var zNodes = [];

                     for ( var i = 0; i < data.length; i++){

                         var pId = data[i].parent;

                         if (pId == null || pId == '' ){

                             var obj = {id:data[i].groupId,pId:0,name:data[i].groupName,isParent: true };

                            zNodes.push(obj);

                        } else {

                             var obj = {id:data[i].groupId,pId:data[i].parent.groupId,name:data[i].groupName,isParent: false };

                            zNodes.push(obj);

                        }

                    }

            

                    $(document).ready( function () {

                     $.fn.zTree.init($( "#treeDemo" ), setting, zNodes);

                    });

                     //节点选择事件

                     function onCheck(e, treeId, treeNode) {

                         var zTree = $.fn.zTree.getZTreeObj( "treeDemo" );

                         var nodes = zTree.getCheckedNodes( true );

                         var groupIds = '' ;

                         for ( var i = 0, l = nodes.length; i < l; i++) {

                             if (nodes[i].isParent) {

                                   

                                } else {

                                    groupIds += nodes[i].id + "," ;

                                }

                        }

                         if (groupIds.length > 0){

                            groupIds = groupIds.substring(0,groupIds.length-1);

                        }

                        $( "#groupId" ).val(groupIds);

                     }

        }

    })

}

2.修改

     jsp:

     

< div id = "umd_edit" class = "modal fade" tabindex = "-1" role = "dialog" aria-labelledby = "myModalLabel" aria-hidden = "true" >

     < form action = "" method = "post" class = "form form-horizontal" id = "form-umd-edit" >

         < div class = "modal-dialog" >

             < div class = "modal-content radius" >

                 < div class = "modal-header" >

                     < h3 class = "modal-title" > 分管修改 </ h3 >

                     < a class = "close" data-dismiss = "modal" aria-hidden = "true" href = "javascript:void();" > × </ a >

                 </ div >

                 < div class = "modal-body" >

                     < div class = "cl row mt-15" >

                        < label for = "" class = "form-label col-xs-3 text-r" >

                            分管领导： </ label >

                        < div class = "formControls col-xs-8" >

                             < strong id = "userId2" ></ strong >

                        </ div >

                     </ div >

                     < div class = "cl row mt-15" >

                        < label for = "" class = "form-label col-xs-3 text-r" >

                            分管部门： </ label >

                        < div class = "formControls col-xs-8 menuContent" id = "menuContent2" >

                       

                             < ul id = "treeDemo2" class = "ztree" style =" margin-top : 0 ; width : 100% ; height : auto ;" ></ ul >

                         </ div >

                     </ div >

                 </ div >

                 < input type = "hidden" id = "umdId" >

                 < input type = "hidden" id = "groupId2" >

                 < div class = "modal-footer" >

                     < button class = "btn btn-primary" type = "submit" > 确定 </ button >

                     < button class = "btn" data-dismiss = "modal" aria-hidden = "true" > 关闭 </ button >

                 </ div >

             </ div >

         </ div >

     </ form >

     </ div >

js:

     

function umdEdit(id,userName,depts){

    $( "#umdId" ).val(id);

    $( "#userId2" ).text(userName);

    $( "#umd_edit" ).modal( "show" );

    $.ajax({

        url : bPath + '/manager/depts/orgTreeById.hrm' ,

        type : 'post' ,

        dataType : 'json' ,

        data : {

             'id' : id

        },

        success : function (data){

             var setting = {

                     view: {

                         selectedMulti: false

                     },

                     check: {

                         enable: true ,

                     },

                     data: {

                         simpleData: {

                             enable: true

                         }

                     },

                     edit: {

                         enable: false

                     },

                     callback: {

                         onCheck: onCheck,

                         }

                    };

                    

                    $(document).ready( function () {

                     $.fn.zTree.init($( "#treeDemo2" ), setting, data);

                    });

                     //节点选择事件

                     function onCheck(e, treeId, treeNode) {

                         var zTree = $.fn.zTree.getZTreeObj( "treeDemo2" );

                         var nodes = zTree.getCheckedNodes( true );

                         var groupIds = '' ;

                         for ( var i = 0, l = nodes.length; i < l; i++) {

                             if (nodes[i].isParent) {

                                   

                                } else {

                                    groupIds += nodes[i].id + "," ;

                                }

                        }

                         if (groupIds.length > 0){

                            groupIds = groupIds.substring(0,groupIds.length-1);

                        }

                        $( "#groupId2" ).val(groupIds);

                     };

        }

    })

}

controller:

     

@RequestMapping (value= "deptEdit_new" ,method=RequestMethod. POST )

     @ResponseBody

     public String deptEdit_new(HttpServletRequest request ,UserManagerDepts dept ){

        String flag = AppConstants. ADD_FAIL ;

        String userName = CurrentUser.currentUser().getUserName();

        Date date = new Date();

         int id = dept .getId();

        String deptIds = dept .getDepts();

        HQLEntityString hes = new HQLEntityString(UserManagerDepts. class .getName());

         hes .equals( "id" , id );

        UserManagerDepts userManagerDepts = chargedeptService .getQueryUserDept( hes ).get(0);

         userManagerDepts .setModifyTime( date );

         userManagerDepts .setModifyUser( userName );

         userManagerDepts .setDepts( deptIds );

         try {

             chargedeptService .updateUserDept( userManagerDepts );

             flag = AppConstants. ADD_SUCCESS ;

        } catch (Exception e ) {

             e .printStackTrace();

        }

        

         return flag ;

    }