EXT树的实现

       项目中用到了书目录管理，需要做成树状结构的管理。下面将部分有用代码写出来，希望能给需要用到的人一些小小的帮助。项目中应用struts2+spring+ext。下面简要介绍几个步骤：

       1、前台extjs的展现代码：

             xinli.ui.SmsCatalogTreePanel = Ext.extend(Ext.tree.TreePanel, {
 catalogId : null, // 选择短信目录的id
 catalogLevel : null,// 选择短信目录的级别
 catalogName : null, // 选择短信目录的名称
 regionCode : null, // 当前用户所在的区域id
 clearSelParams : function() {
  this.catalogId = null;
  this.catalogLevel = null;
  this.catalogName = null;
  this.regionCode = null;
 },
 initComponent : function() {

  Ext.apply(this, {
     title : '短信目录管理',
     region : 'west',
     width : 250,
     minSize : 200,
     maxSize : 250,
     border : true,
     frame : false,
     rootVisible : true,
     autoScroll : true,
     autoHeight : false,// 自动高
     containerScroll : true,
     root : new Ext.tree.AsyncTreeNode({
        id : "1",
        text : "短信目录",
        qtip : '短信目录',
        expanded : true
       }),
     loader : new TonyTreeLoader({
        url : "createSmsCatalogTree.action",
        listeners : {
         "beforeload" : function(treeLoader, node) {
          treeLoader.baseParams.id = (node.id != "1"
            ? node.id
            : "");
         }
        }
       })
    });

  xinli.ui.SmsCatalogTreePanel.superclass.initComponent.call(this);

  /*
   * var treeEditor = new Ext.tree.TreeEditor(this, { allowBlank : false
   * }); treeEditor.on("beforestartedit", function(treeEditor) { return
   * treeEditor.editNode.isLeaf(); }); treeEditor.on("complete",
   * function(treeEditor) { alert(treeEditor.editNode.text); });
   */

  this.addListener('click', function(node) {
     var catalogId = node.id;
     var store = this.ownerCt.items.itemAt(1).getStore();
     store.baseParams.catalogId = catalogId;
     store.load();  //此处的store为该目录所对应的详细模板列表数据

    }, this);
 }
});

 

 

2、后台逻辑实现：

       public String createSmsCatalogTree() {
  SysUser user = (SysUser) getSession().getAttribute("user");
  String catId = (String) getRequest().getParameter("id");
  if (catId == null || catId.equals("")) {
   catId = "1";
  }
  treeList = getValidTreeNode(catId, user
    .getRegionCode());
  if (treeList == null) {
   treeList = new ArrayList<Map<String, Object>>();
  }
  return SUCCESS;

 }

 

private List<Map<String, Object>> getValidTreeNode(String catId,
   Integer regionCode) {

  SmsCatalog smsCatalog = new SmsCatalog();
  log.info("catId==" + catId);
  smsCatalog.setCatalogId(Long.parseLong(catId));
  smsCatalog.setRegionCode(regionCode);
  List<Map<String, Object>> retList = new ArrayList<Map<String, Object>>();
  try {
   List<SmsCatalog> catalogList = smsCatalogService
     .querySubSmsCatalogList(smsCatalog);
   log.info("catalogList==" + catalogList.size());
   for (SmsCatalog sc : catalogList) {
    Map<String, Object> tree = new HashMap<String, Object>();
    // 节点的id
    tree.put("id", sc.getCatalogId());
    // 节点显示单位名
    tree.put("text", sc.getCatalogName());
    // 是否是叶子节点
    List<SmsCatalog> temlist = smsCatalogService
      .querySubSmsCatalogList(sc);
    tree.put("leaf",
        temlist.size() == 0 || temlist.isEmpty() ? true
          : false);
    // 目录等级
    tree.put("type", sc.getCatalogLevel());
    
    // 父目录ID
    tree.put("parentId", sc.getParentId());
    // 将这个生成叶子节点对应的MAP加到单位list里
    retList.add(tree);
   }
  } catch (Exception e) {
   e.printStackTrace();
  }
  return retList;
 }

 

 

    3、sturts.xml 文件中的配置

<action name="createSmsCatalogTree" class="smsCatalogAction" method="createSmsCatalogTree" >
   <result type="json">
    <param name="root">treeList</param>
   </result>
  </action>

 

重要的就是上面三大步骤。对于目录树删除、修改、新增的功能，这里不做详解。在做的过程中碰到如下的问题

action中给

    //结点id

    tree.put("id", sc.getCatalogId());
    // 节点显示单位名
    tree.put("text", sc.getCatalogName());
    // 是否是叶子节点
    tree.put("leaf",true);  三个属性  id    text   leaf可以通过

     var id=  thisPanel.selModel.selNode.id 方式获得

    但是type  以及 parentid 附加属性需要通过
        var catalogLevel = thisPanel.selModel.selNode.attributes.type;
        var parentId = thisPanel.selModel.selNode.attributes.parentId; 方式获得