dom4j读取xml文件，用extjs以树的形式显示

1.xml文件形式

 

2.利用dom4j来解析xml文件

（1）准备dom4j-1.6.1-sources.jar包

（2）读取xml文件，获取document对象

SAXReader reader=new SAXReader(); Document document=reader.read(new File(xmlPath));

3.要想将xml文件转化为json，就是将xml文件先转化为Java对象，然后再转化为json

4.建一个product对象

private String id; private String name; private String parentRef; private List<Product> children;

此处set、get方法省略，

5.获取文档的根节点

Element ele=document.getRootElement(); //迭代当前节点下面的所有子节点 Iterator<Element> iterator = node.elementIterator(); while(iterator.hasNext()){ Element element = iterator.next(); Product product = new Product(); product.setName(element.attributeValue("name")); //属性名称 product.setId(element.attributeValue("id")); product.setParentRef(element.attributeValue("parentRef")); //System.out.println(product.toString()); proList.add(product); getNodes(element,proList); }

6.获得所有的节点之后，将所有的节点放入rootProducts（这是个List集合）中，然后将节点转化为product对象

for(Product rootProduct:rootProducts){ List<Product> children = new ArrayList<>(); for(Product childProduct:rootProducts){ //System.out.println(rootProduct.toString()); //根据属性来确认父子关系 if(rootProduct.getId().equals(childProduct.getParentRef())){ children.add(childProduct); } Product pro=new Product(); rootProduct.setChildren(children); } if("".equals(rootProduct.getParentRef())){ parentProductList.add(rootProduct); } }

7.接下来就该把product对象转化为JSONObject

（1）在product对象内写一个方法toJson（）；

public JSONObject toJson(){ JSONObject jsonObject=new JSONObject(); jsonObject.put("id", this.getId()); jsonObject.put("text", this.getName()); if(this.children!=null){ JSONArray jsonArray=new JSONArray(); for(Product child:this.children){ jsonArray.add(child.toJson()); } if(!(jsonArray.isEmpty())){ jsonObject.put("leaf", false); jsonObject.put("expanded", true); jsonObject.put("children", jsonArray); }else{ jsonObject.put("leaf", true); } } return jsonObject; }

（2）进而得到所有节点的JSONObject

public static String getJSON(List<Product> productList){ JSONArray json=new JSONArray(); for(Product pro:productList){ json.add(pro.toJson()); } JSONObject rootObj=new JSONObject(); rootObj.put("children", json); rootObj.put("text", "项目"); rootObj.put("expanded", true); String jsonStr=rootObj.toString(); //System.out.println(rootObj.toString()); //System.out.println(jsonStr); return jsonStr; }

8.在jsp页面上获取到该jsonStr然后用extjs展示出来

Ext.onReady(function () { //树的节点数据源 var node =<%=jsonNode %> //树面板(本地数据源) var treelocal = new Ext.tree.TreePanel({ title: '项目分类', //rootVisible: false, root: node }); //单表 var form = new Ext.form.FormPanel({ frame: true, //title: '项目分类', style: 'margin:10px', items: [treelocal], buttons: [{ text: '确定', handler: function () { selectNode = treelocal.getSelectionModel().getSelectedNode(); if(selectNode==null){ lert("请选择项目类型~"); } else{ var nodeIdPath=selectNode.getPath(); var length=nodeIdPath.split("/").length; var nodeNamePath=""; for(var i=1;i<length;i++){ var arr=nodeIdPath.split("/"); //根据id找到节点，获取节点的text var arrName=treelocal.getNodeById(arr[i]).text; nodeNamePath+=arrName+"/"; } nodeNamePath=nodeNamePath.substring(0,nodeNamePath.length-1) window.opener.document.getElementById("projectSorts").value=nodeNamePath; window.close(); } } },{ text: '取消', handler: function () { window.close(); } }] }); //窗体 var win = new Ext.Window({ //title: '', width: 476, height: 574, resizable: true, //modal: true, closable: false, maximizable: false, minimizable: false, items: form }); win.show(); });

       

       

9.最后展示的结果是：