Extjs树的动态加载

来源：互联网发布：仿91自动发卡平台源码编辑：程序博客网时间：2024/05/08 22:19

Extjs树的动态加载

http://myhothat.blog.163.com/blog/static/12420707620099169711838/?fromdm&isFromSearchEngine=yes

1.页面js

Ext.onReady(function(){
    var group=new Ext.tree.TreePanel({
         id:'car_group_TreePanel',
         width:200,
         region:'center',
         enableDD:true,
          //根
         root:new Ext.tree.AsyncTreeNode({
             text:'集团',
             //不可拖动
             draggable:false,
             //目录效果
             leaf:false,
             icon:'img/folder.gif',
             id:-1
         }),
          //激活的根
         activeRoot:null,
         loadNode:null,
         //添加子项的根
         addNode:null,
         //默认激活对象
         activeNode:null,
         containerScroll: true,
         //车辆组织dwr加载
    loader:new Ext.tree.DWRTreeLoader({
       //加载组织方法
                dataUrl:CarGroupService.findAllCarGroupsById

      }),

     //创建监听器
      listeners:{
      'click':function(node){
       //当前的节点为活跃的节点是自定义属性
         this.activeNode=node;
       Ext.getCmp("car_manage_Togroup").setValue(node.text);
       document.getElementById("targetId").value=node.id;
       if(node.id){
       var car={carId:node.id};
                        Ext.getCmp("car_manage_PagingToolbar").firstPage(car);
       }

                }
                ,
                'movenode':function(tree, node, oldParent, newParent,
        index){
        var item=new Array();
        item[0]=new Number(node.id);
        item[1]=new Number(newParent.id);

       CarGroupService.changeParent(item);


                },
                'beforemovenode':function(tree,node,oldParent,newParent){
                   if(newParent.id==-2||node.id<0){
                   return false;
                   }

                }
      }
     });
      var cwin=new Ext.Panel({
      width:726,
      height:470,
      frame:false,
       region:'center',
       layout:'border',
       items:[
       group

  ]
     });
//viewport
var viewport=new Ext.Viewport({
      layout:'border',
      items:[cwin]
});
});

2.jsp页面

   <%@ page pageEncoding="UTF-8"%>
<html>
<%
String p = request.getContextPath();
%>
<head>
<title>车辆分组</title>
<jsp:include page="../include_extjs.jsp"></jsp:include>
<script src="<%=p%>/resource/extjs/ext-dwr.js"></script>
<script src="<%=p%>/resource/extjs/rowexpander/RowExpander.js"></script>
    <script src='<%=p%>/dwr/engine.js'></script>
    <script src='<%=p%>/dwr/interface/CarService.js'></script>
    <script src='<%=p%>/dwr/interface/CarGroupService.js'></script>
    <script src="<%=p%>/resource/util/array.js"></script>
    <script type="text/javascript" src="dwrtreeload.js"></script>
    <script type="text/javascript" src="index.js"></script>
</head>

3.树的dwr调用文件 dwrtreeload.js

//js
Ext.tree.DWRTreeLoader = function(config) {
Ext.tree.DWRTreeLoader.superclass.constructor.call(this, config);
};

Ext.extend(Ext.tree.DWRTreeLoader, Ext.tree.TreeLoader, {
   args:[],
   requestData : function(node, callback) {

    if (this.fireEvent("beforeload", this, node, callback) !== false) {
      var callParams = new Array();
      var success = this.handleResponse.createDelegate(this, [node, callback], 1);
      var error = this.handleFailure.createDelegate(this, [node, callback], 1);
      //var userId=Ext.getCmp("car_search_TreePanel").userId;
      callParams.push(node.id);
      //callParams.push(userId);
      callParams.push({callback:success, errorHandler:error});

      //todo: do we need to set this to something else?
      this.transId=true;
      this.dataUrl.apply(this, callParams);
    } else {
      // if the load is cancelled, make sure we notify
      // the node that we are done
      if (typeof callback == "function") {
         callback();
      }
    }
},
    processResponse : function(response, node, callback){
        try {
          for(var i = 0; i < response.length; i++){
                var n = this.createNode(response[i]);
                if(n){
                    node.appendChild(n);
                }
            }
            if(typeof callback == "function"){
                callback(this, node);
            }
        }catch(e){
            this.handleFailure(response);
        }
    },
    //响应
    handleResponse : function(response, node, callback){
        this.transId = false;
        this.processResponse(response, node, callback);
        this.fireEvent("load", this, node, response);
    },
    //出异常
    handleFailure : function(response, node, callback){
        this.transId = false;
        this.fireEvent("loadexception", this, node, response);
        if(typeof callback == "function"){
            callback(this, node);
        }
    }

});
//dwr-tree-proxy

4.业务方法

CarGroupService.java中的方法

public List findAllCarGroupsById(int id) throws Exception {
return carGroupDAO.findAllCarGroupsById(id);
}
CarGroupDAO的方法

public List findAllCarGroupsById(int id) throws Exception {
  if(id == 0)
   throw new Exception("查询所有车辆组织通过组织集团的编号时参数id为空");
  String sql = "";
  Session session = this.getSession();
  Query query = null;
  List list = new ArrayList();
  List treeNodes = new ArrayList();
  CarGroupVo groupVo = null;
  TreeNode node = null;
  if (id == -1) {
   sql = "select id,groupTitle,parentGroup_id as parentGroupId,rootGroup_id as rootGroupId,isPrivate,isDelete from carGroup where parentGroup_id is null and rootGroup_id is null and isdelete!=1";
   query = session.createSQLQuery(sql).addEntity(CarGroupVo.class);
   list = query.list();
      CarGroupVo carGroup=new CarGroupVo();
      carGroup.setId(-2);
      carGroup.setIsDelete(0);
      carGroup.setIsprivate(false);
               carGroup.setGroupTitle("默认组织");
               node=new TreeNode(carGroup);
               treeNodes=new ArrayList();
      treeNodes.add(node);
     } else {
   sql = "select id,groupTitle,parentGroup_id as parentGroupId,rootGroup_id as rootGroupId,isPrivate,isDelete from carGroup where parentGroup_id=:id and isdelete!=1";
   query = session.createSQLQuery(sql).addEntity(CarGroupVo.class)
     .setInteger("id", id);
   list = query.list();
  }

  Iterator it = list.iterator();
  while (it.hasNext()) {
   groupVo = (CarGroupVo) it.next();
   node = new TreeNode(groupVo);
    treeNodes.add(node);
  }
  return treeNodes;

}

5.TreeNode.java类

package jiuyee.gps2.car.model;
import java.util.ArrayList;
import java.util.List;
import javax.persistence.Entity;
import javax.persistence.FetchType;
import javax.persistence.Id;
import javax.persistence.OneToMany;
import javax.persistence.OneToOne;
import jiuyee.gps2.car.vo.CarGroupVo;

@Entity
public class TreeNode {
@Id
    private String id;
    private String text;
    private String icon="img/folder.gif";
    private boolean leaf;
    private boolean draggable;
    private String isGroup;
    @OneToOne
    private CarGroupVo carGroup;
public TreeNode(CarGroupVo carGroup) {
this.carGroup=carGroup;
}
public String getId() {
  return carGroup.getId().toString();
}
public String getText() {
  return carGroup.getGroupTitle();
}

public boolean isLeaf() {
  return false;
}
public boolean isDraggable() {
  return true;
}
public CarGroupVo getCarGroup() {
  return carGroup;
}
public void setCarGroup(CarGroupVo carGroup) {
  this.carGroup = carGroup;
}
public String getIcon() {
   return this.icon;
}
public String getIsGroup() {
  return this.isGroup="Group";
}
public void setId(String id) {
  this.id = id;
}
public void setIcon(String icon) {
  this.icon = icon;
}
}