（二 ）结构ztree的 ajax交互的简单使用

 在第一篇的基础上更改，在实际项目中的使用。

一：HTML 代码：

<SCRIPT type="text/javascript">
        var setting = {
            async: {
                enable: true,
                url:"${ctx}/threeLesson/ztreeAjax", //没点击一次节点AJAX 都会与此路径交互一次
                autoParam:[ "id", "name" ], //ajax提交的时候，传的是id值
                otherParam:{"chk":"chk"},
                dataFilter: dataFilter
            },
            check: {
                enable: true,
                autoCheckTrigger: true
            },
            data: {
                simpleData: {
                    enable: true,
                    idKey : "id", // id编号命名   
                    pIdKey : "pId", // 父id编号命名    
                    rootPId : 0 
                }
            },
            callback: {
                onCheck: onCheck,
                onAsyncSuccess: onAsyncSuccess
            }
        };
    
        function dataFilter(treeId, parentNode, childNodes) {
            if (parentNode.checkedEx === true) {
                for(var i=0, l=childNodes.length; i<l; i++) {
                    childNodes[i].checked = parentNode.checked;
                    childNodes[i].halfCheck = false;
                    childNodes[i].checkedEx = true;
                }
            }
            return childNodes;
        }
        function onCheck(event, treeId, treeNode) {
            cancelHalf(treeNode)
            treeNode.checkedEx = true;
        }
        function onAsyncSuccess(event, treeId, treeNode, msg) {
            cancelHalf(treeNode);
        }
        function cancelHalf(treeNode) {
            if (treeNode.checkedEx) return;
            var zTree = $.fn.zTree.getZTreeObj("treeDemo");
            treeNode.halfCheck = false;
            zTree.updateNode(treeNode);            
        }
        var zNodes =[  
　　　　　//根节点，  ${department.id}。。。等数据是服务器传回来的   isParent:true：是否是父节点，毫无疑问我找个是父节点所以要添加找个参数       
                    { id:"${department.id}", pId:"${department.parentId}", name:"${department.name}", isParent:true}                    
                 ];              
        
        $(document).ready(function(){
            $.fn.zTree.init($("#treeDemo"), setting, zNodes);
        });
        //获取ID值
        function onCheck(e,treeId,treeNode){
            var treeObj=$.fn.zTree.getZTreeObj("treeDemo"),
            nodes=treeObj.getCheckedNodes(true),
            v="";
            id="";
            for(var i=0;i<nodes.length;i++){
            v+=nodes[i].name + ",";
            id+=nodes[i].id + ",";
           }
            $("#myid").val(id);
         }

</SCRIPT>

             <table>
            <tr>
                <td width="80px" align="left" valign="top" >发送给谁：</td>
                <td><ul id="treeDemo" class="ztree" ></ul></td>
            </tr>
           </table>

二：action代码：

    /**
     * 点击树节点请求此接口
     * @param id  :Department的ID
     * @param response
     * @param model
     * @throws Exception
     */
    @RequestMapping(value="/threeLesson/ztreeAjax",method=RequestMethod.POST)
    public void ztreeTestpost(String id,HttpServletRequest request,HttpServletResponse response,ModelMap model) throws Exception{
        request.setCharacterEncoding("gb2312"); 
        response.setContentType("text/html;charset=utf-8");    
        //查找组织下的用户
        List<User> userList=userService.getUserListByOrganizationId(Long.valueOf(id));
        //获取部门
        List<Department> departmentList=departmentService.getDepartmentByParentId(Long.valueOf(id));

        StringBuffer strbuf=new StringBuffer("[");
        if (departmentList.size()>0) {
            for (int i = 0; i < departmentList.size(); i++) {
                strbuf.append("{\"id\":"+departmentList.get(i).getId()+",\"pId\":"+departmentList.get(i).getParentId()+",\"name\":\"" +departmentList.get(i).getName()+"\",isParent:true},");
            }
        }
        if (userList.size()>0) {
            for (int i = 0; i < userList.size(); i++) {
                String uid="u"+Long.toString(userList.get(i).getId()); // 加U区分用户ID和组织ID
                strbuf.append("{\"id\":\""+uid+"\",\"pId\":"+userList.get(i).getOrganizationId()+",\"name\":\"" +userList.get(i).getName()+"\"},");                    
            }
        }                        
        String ss=strbuf.toString();
        ss=ss.substring(0, ss.length()-1);
        ss=ss+"]";
        PrintWriter pw = response.getWriter(); 
        pw.write(ss);    
    }

 

转载于:https://www.cnblogs.com/sunhaoyu/p/4788997.html