一个ext树的封装与实现

var selectStr="";
var ext_Tree = function(){
    var Tree = Ext.tree;
    var tree;
    var root;
    return{
        init:function(){
            tree = new Tree.TreePanel({
                el:extTree.treeDiv,
                useArrows:true,
                autoScroll:true,
                animate:true,
                enableDD:false,
                containerScroll: true,
                border:true,
                rootVisible:true,
                loader: new Tree.TreeLoader({
                    dataUrl:extTree.dataUrl
                })
            });
            // set the root node
            root = new Tree.AsyncTreeNode({
                text: extTree.rootName,
                draggable:false,
                id:extTree.rootId,
                type:extTree.type
            });
            tree.setRootNode(root);
            tree.on(
                'beforeload',
                function(node){
                    if(beforeLoad){
                        beforeLoad(tree,node);
                    }
            });
            tree.on(
                'click',
                function(node){
                    node.expand();
                    //if(parent.nodeOnClick){
                        nodeOnClick(node);
                   // }
            });
            tree.on(
                'dblclick',
                function(node){
                    node.expand();
                   // if(parent.nodeOnDbClick){
                        nodeOnDbClick(node);
                    //}
            });
            tree.on(
                'expandnode',
                function(node){
                    //if(parent.nodeOnExpand){
                        nodeOnExpand(node);
                    //}
            });
            tree.on(
                'collapsenode',
                function(node){
                    if(nodeOnCollapse){
                        nodeOnCollapse(node);
                    }
            });        
            // render the tree
            tree.render();
            root.expand();
        },
        reUP : function(str){
            selectStr="selectStr="+str;
            root.reload();
            selectStr="";
        }
    }
    tree.root.reload();
}();
Ext.EventManager.onDocumentReady(ext_Tree.init, ext_Tree, true);

 

 

<%@ page contentType="text/html; charset=UTF-8" %>

<%@ taglib uri="/WEB-INF/struts-bean.tld" prefix="bean" %>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
<%@ taglib uri="/WEB-INF/struts-logic.tld" prefix="logic" %>
<%@ taglib uri="/WEB-INF/struts-tiles.tld" prefix="tiles" %>
<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
	<%=request.getAttribute("cssScript")%>
        <link rel="stylesheet" type="text/css" href="<html:rewrite page="/javascripts/ext/resources/css/ext-all.css"/>" />
        <SCRIPT language="javascript" src="<html:rewrite page="/javascripts/ext/ext-base.js"/>"></SCRIPT>
        <SCRIPT language="javascript" src="<html:rewrite page="/javascripts/ext/ext-all.js"/>"></SCRIPT>
        <SCRIPT language="javascript" src="<html:rewrite page="/javascripts/tree/extTree.js"/>"></SCRIPT>
 </HEAD>

 <BODY>
  <div id="tree-div" style="overflow:auto; height:100%;width:150px;border:0px solid #c3daf9;"></div>
 </BODY>
</HTML>
<script language='javascript'>
        var base = "<html:rewrite page=""/>";
        var listAll = "1";	
        /**
          *初始化树
          */
        var extTree = new Object();
        //加载树的Div
        extTree.treeDiv = "tree-div";
        //根节点id
        extTree.rootId = "1500000000";
        //根节点名称
        extTree.rootName = "内部论坛";
        //根节点类型
        extTree.type = "0";
        //一次性加载树所有节点时url
        extTree.dataUrl = "";
        var sel_node = null;
        //树节点加载前事件
        function beforeLoad(tree,node){
            tree.loader.dataUrl = base+"/scripts/refer.do?doType=bbsTypeList&orgId="+node.attributes.id+"&listAll="+listAll+"&"+selectStr;
        	//window.parent.frames[1].location = base+"/scripts/bbs.do?doType=treeList&objId="+node.attributes.id;
        }
        //节点被选中事件
        function nodeOnClick(node){
            if(node.attributes.type == '0'){
                sel_node = node;
            }
            
            window.parent.frames[1].location = base+"/scripts/bbs.do?doType=list&objId="+sel_node.attributes.id;
        }
        //节点被双击事件
        function nodeOnDbClick(node){
            if(node.attributes.type == '0'){
                sel_node = node;
            }
            window.parent.frames[1].location = base+"/scripts/bbs.do?doType=list&objId="+sel_node.attributes.id;
        }
        //节点展开时事件
        function nodeOnExpand(node){
            if(node.attributes.type == '0'){
                node.getUI().removeClass("x-tree-node-collapsed");
                node.getUI().removeClass("x-tree-node-leaf");
                node.getUI().addClass('x-tree-node-expanded');
            }
        }
		//节点合并时事件
		function nodeOnCollapse(node){
			
		}
        
        var nId;
        function timeOut(str){
            window.clearTimeout(nId);
            str=str.replace(/\\/ig,"\\\\").replace(/\"/ig,"\\\"").replace(/%/ig,"%25").replace(/&/ig,"%26").replace(/#/ig,"%23").replace(/\+/,"%2B");
            nId=window.setTimeout("ext_Tree.reUP('"+str+"');",1000);
        }
        function addOrg(){
            if(sel_node == null){
                alert("请先选择机构!");
                return;
            }
            var orgId = sel_node.attributes.id;
            var orgName = sel_node.attributes.text;
            var len = dtb.table.rows.length;
            var j = 0;
            for(var i=0;i<len*1;i++){//>
                var id = dtb.table.rows[i].cells[1].innerText;
                if(orgId == id){
                    j++;
                    break;
                }
            }
            if(j==0){
                insertRow(orgId,orgName);
            }
        }
        function insertRow(id,name){
            var row = dtb.table.insertRow();
            var cell;
            row.className = "GridItem";
            row.style.wordWrap = "break-word";
            row.style.wordBreak = "break-all";
            //0 名称
            cell = row.insertCell();
            cell.style.width = "254";
            cell.noWrap = true;
            cell.innerText = name;
            //0 编号
            cell = row.insertCell();
            cell.style.display = "none";
            cell.innerText = id;
        }
        function delOrg(){
            if(dtb.selRow == null){
                alert("请先选中一条机构!");
                return;
            }
            dtb.temp_deleteSelRow();
            if(dtb.table.rows.length*1>0){
                dtb.temp_setSelectRow("0");
            }
        }
        function doConfirm(){
            var reValue = new Array();
            var len = dtb.table.rows.length;
            for(var i=0;i<len*1;i++){//>
                var value = new Object();
                value.value = dtb.table.rows[i].cells[1].innerText;
                value.innerText = dtb.table.rows[i].cells[0].innerText;
                reValue[i] = value;
            }
            window.returnValue = reValue;
            window.close();
        }
        function doExit(){
            window.close();
        }
</script>

  

你可能感兴趣的:(JavaScript,struts,css,ext,bbs)