iMatrix平台中自定义树使用例子讲解

1.1   使用例子

1.1.1    单棵树:

1 前台js中

custom_ztree({url:webRoot+'/index/role-tree.htm',

                                                                 onsuccess:function(){closeFun();},

                                                                 inputObj:'roleName',

                                                                 width:500,

                                                                 height:600,

                                                                 title:'选择角色',

                                                                 postData:{systemId:$("#systemId").attr("value")},

                                                                 nodeInfo:['type','roleId','roleName'],

                                                                 multiple:true

                                                        });

2 后台Action中拼树的写法

    @Action("role-tree")

    public String roleTree() throwsException{

       List<ZTreeNode>treeNodes = new ArrayList();

       Stringresult ="";

       BusinessSystemsystem = businessSystemManager.getBusiness(businessSystemId);

       Listroles = new ArrayList();

       String[]roleids = roleIdStrs.split(",");

       ListroleIds = new ArrayList();

       for(Stringroleid:roleids){

           roleIds.add(Long.parseLong(StringUtils.trim(roleid)));

       }

       roles= roleManager.getAllRolesExceptRole(businessSystemId,roleIds);

       ZTreeNode root = newZTreeNode("system~~system","0",system.getName(),"true", "false", "", "","folder", "");

       treeNodes.add(root);//将节点放入节点集合中

       for(Rolerole:roles){          

           root = newZTreeNode("role~~"+role.getId(),"system~~system",

role.getName(), "false", "false", "","", "folder", "");

           treeNodes.add(root); //将节点放入节点集合中          

       }

    result= JsonParser.object2Json(treeNodes);//将节点集合封装为json字符串

       renderText(result);//将节点显示在页面中

       returnnull;

    }

其页面展示如图：

1.1.2    页签树:

custom_ztree({tree:{'标签1':{url:webRoot+'/vehicle/vehicle-choose-all-unused-car-tree.htm',

onsuccess:function(){closeFun1();},                                                            

nodeInfo:['type','id'],                                                                                                         postData:{startDate:startDate,endDate:endDate}},

'标签2':{url:webRoot+'/vehicle/vehicle-choose-all-unused-car-tree.htm?startDate='

+startDate+'&endDate='+endDate,

 multiple:true}},

onsuccess:function(){closeFun();},

width:500,

height:600,

title:'选择车辆'

});