前段时间项目中要做一个供应商打分模块。供应商的打分项他的展现是一棵树，所以我就想到利用DhtmlXTree来实现，因为DhtmlXTree利用少量代码就可以实现动态加载一棵树的功能。

?

准备工作：

1.需要的js 和jar包

?? dhtmlxcommon.js

?? dhtmlxtree.js

?? dhtmlxtree.css

?

?? dom4j-1.6.1.jar

?

2.先建立一棵DhtmlXTree

?

<div id="treeboxbox_tree" style="width:400px; height:600px;background-color:#f5f5f5;border :1px solid Silver;; overflow:auto;">
<script type="text/javascript">
	tree=new dhtmlXTreeObject("treeboxbox_tree","100%","100%",0);
</script>
 </div>

?

?

3.设置一下一些初始化参数

?

// 设置树的皮肤
tree.setSkin('dhx_skyblue');
// 设置树图片的路径
tree.setImagePath("../../images/dhtml/csh_yellowbooks/");
//设置树的编码
tree.setEscapingMode("GBK");

tree.enableCheckBoxes(0);            //是否显示复选框
//从XML 加载 DhtmlXTree
var s_loadURL = "<%=request.getContextPath()%>/bank/rating/getRatingProjectGuid.do";
tree.setXMLAutoLoading(s_loadURL);
tree.loadXML(s_loadURL);

?

?

4利用dom4j 生成XML

?

   /**
     * 生成一个可以生成DHtmlXTree的XML文件，包括根节点tree;
     * @return Document
     */
    public static Document createNewDhtmlXTreeXML(){
    	Document document = DocumentHelper.createDocument();
    	Element root = document.addElement("tree");
    	root.addAttribute("id", "0");
    	return document;
    }
    /**
     * 向 DHtmlXTree 中添加一个新的节点
     * @param element 父节点
     * @param id 节点ID
     * @param text 节点显示的名称
     * @param userData 用户 自己的数据保存在 userData 中 数据类型String
     * @param map 设置节点 相关属性的map （当前可以设置的属性有 im0,im1,im2,open,child）
     * @return Element
     */
    public static Element buildTreeNode(Branch element , String id , String text, String userData , Map proMap){
    	if (element!=null && id != null  && text !=null ) {
			Element item = element.addElement("item");
			item.addAttribute("id", id);
			item.addAttribute("text",text);
			if (proMap != null ) {
				String im0 = (String)proMap.get("im0");
				String im1 = (String)proMap.get("im1");
				String im2 = (String)proMap.get("im2");
				String open = (String)proMap.get("open");
				String child = (String)proMap.get("child");
				if (im0!=null && !"".equals(im0)) {
					item.addAttribute("im0",im0);
				}
				if (im1!=null && !"".equals(im1)) {
					item.addAttribute("im1",im1);
				}
				if (im2!=null && !"".equals(im2)) {
					item.addAttribute("im2",im2);
				}
				if (open!=null && !"".equals(open)) {
					item.addAttribute("open",open);
				}
				if (child!=null && !"".equals(child)) {
					item.addAttribute("child",child);
				}
			}
			if(userData != null && !"".equals(userData)){
				Element userdata = item.addElement("userdata");
				userdata.addAttribute("name", text);
				userdata.addText(userData);
			}
			return item;
		}else{
			System.out.println("Element对象为null 或者id 为null 或者text 为null ");
		}
			return null ;

    }

?

?

?

5 Dao 层 代码

	public String getRatingProjectXml(String parentId) throws Exception {
		Document doc = null;
		Element item = null;
		try {
			if (parentId==null || "".equals(parentId) || "null".equals(parentId)) {
				// 进入根节点进行操作
				Map proMap = new HashMap();
				//proMap.put("im0", "tombs.gif");
				proMap.put("open", "1");

				doc = XmlUtil.createNewDhtmlXTreeXML(); //  得到一个用于生成DHtmlXTree 的XML 文件

				// 添加根节点
				item = XmlUtil.buildTreeNode(doc.getRootElement(), Common.DOMAIN_ROOT_ID, Common.DOMAIN_ROOT_NAME, null, proMap);
				// 得到一级节点
				List<BRatingProject> bRatingProjects = getBRatingProjectByParentId(Integer.parseInt(Common.DOMAIN_ROOT_ID));
				getRatingProjectXml(item,bRatingProjects);
			}else {
				// 进入非根节点
				doc = XmlUtil.createNewXml();
				BRatingProject bRatingProject = getBRatingProjectById(Integer.parseInt(parentId));
				List<BRati