用AJAX实现从数据库读取数据实现TreeView（三）

3、请求数据RequestData:
此部分根据TreeView中节点的节点事件来读取服务器上的分类信息。

var  FIRST_NODE     =   " firstNode " ;
var  SECOND_NODE     =   " secondNode " ;
var  NODE_ID         =   " id " ;
var  NODE_NAME     =   " name " ;
var  NODE_HAS_CHILDS     =   " hasChilds " ;
var  NODE_LEVEL     =   " Levels " ;
var  NODE_URL     =   " Url " ;

/**/ /*
TreeView显示图标
*/
var  objIcons  =   new  Array(
     " image/L4.gif " ,
     " image/L1.gif " ,
     " image/L2.gif " ,
     " image/P0.gif " ,
     " image/P1.gif " ,
     " image/P2.gif " ,
     " image/M0.gif " ,
     " image/M1.gif " ,
     " image/M2.gif " ,
     " image/folderopen.gif " ,
     " image/folder.gif " ,
     " image/file.gif " ,
     " image/L5.gif " ,
     " image/P3.gif " ,
     " image/M3.gif "
);

/**/ /*
    创建树的父容器
*/
function  CreateParentContainer()
... {
    var parentNode = document.createElement( "div" );    
    parentNode.setAttribute( "className","zhTreeView" );
    document.body.appendChild( parentNode );
    return parentNode;
}

/**/ /*
请求数据脚本
host:        对于图标而言，其主目录地址
url:        请求的地址
postfix:    后缀名称,?name中的name
id:            ?name=id中的id
parentNode:    树的父节点
channelName:通道名称
targetFrame:链接目标框架名称
colorMouseOver:OnMouseOver时的背景颜色
*/
function  RequestHandler( host,url,postfix,id,parentNode,channelName,targetFrame,colorMouseOver )
... {
    this.host = host;
    this.strUrlText = url;
    this.strPostfix = postfix;
    this.strID = id;
    this.parentNode = parentNode;
    this.channelName = channelName;
    this.targetFrame = targetFrame;
    this.colorMouseOver = colorMouseOver;
    
    /**//*
        请求数据
    */
    this.RequestData = function()
    ...{
        var goUrl = this.strUrlText + '?' + this.strPostfix + '=' + this.strID + '';
        Request.send( goUrl ,this.RequestDataCallback,this.channelName,true,this );
    }

    /**//*
        异步请求结束
        obj:    请求数据返回的XML对象
        handler:当前对象
    */
    this.RequestDataCallback = function( obj,handler )
    ...{    
        //创建树    
        window.tree = new TreeView( handler,objIcons,handler.targetFrame,handler.colorMouseOver );
        var bHasParent = true;    //是否有父节点
        //检查父容器是否为空，如果为空，则创建        
        if( handler.parentNode == null | handler.parentNode == undefined )
        ...{
            handler.parentNode = CreateParentContainer();
            bHasParent = false;
        }
        else
        ...{
            //清除子节点
           var nodes = handler.parentNode.childNodes;
           if( nodes != null && nodes != undefined )
           ...{
                var len = nodes.length;           
                for( var i = len - 1; i > 0; i-- )
                ...{
                        handler.parentNode.removeChild( nodes[i] );        
                }
           }
        }
        //读取接收到的数据
        var xmlobj = obj.responseXML;
        var firstNodes = xmlobj.getElementsByTagName( FIRST_NODE );
        var tmpNode = null;
        var tmpChildNodes = 0;
        //读取一级分类
        for( var i = 0; i < firstNodes.length; ++i )
        ...{
            tmpChildNodes = 0;
            tmpNode = CreateNode( firstNodes[i],tree,i,firstNodes.length,bHasParent,handler.parentNode );
            //读取二级分类
            tmpChildNodes = firstNodes[i].childNodes.length;
            if( tmpChildNodes )
            ...{            
                for( var j = 0; j < tmpChildNodes; ++j )
                ...{
                    tmpNode.appendChild( CreateNode( firstNodes[i].childNodes[j],tree,j,tmpChildNodes,true,tmpNode) );
                }
            }
            //添加到父容器中
            handler.parentNode.appendChild( tmpNode );
        }
        ExpandNextNodes( handler.parentNode );
    }    
}      // end RequestHandler

/**/ /*
    根据XML节点创建树节点
    objXmlObject:    xml节点
    treeObject:        TreeView对象
    index:            当前节点索引
    nodesLength:    当前级别节点总数
    bHasParent:        是否有父节点
*/
function  CreateNode( objXmlNode,treeObject,index,nodesLength,bHasParent,parentNode )
... {
    var tmpUrl = '';
    var tmpID = '';
    var tmpName = '';
    var tmpHasChilds = false;
    var tmpLevels = 1;
    var nLocation = 1;
    tmpUrl = objXmlNode.getAttribute( NODE_URL );
    tmpID = objXmlNode.getAttribute( NODE_ID );
    tmpName = objXmlNode.getAttribute( NODE_NAME );
    tmpHasChilds = objXmlNode.getAttribute( NODE_HAS_CHILDS );
    tmpHasChilds = ( tmpHasChilds == "true" ? true : false );
    tmpLevels = objXmlNode.getAttribute( NODE_LEVEL );
    index += 1;
    switch( index )
    ...{
        case 1:
            nLocation = 1;
            break;
        case nodesLength:
            nLocation = 3;
            break;
        default:
            nLocation = 2;
            break; 
    }
    //如果此节点有子节点，则显示
    var display = objXmlNode.childNodes.length > 0 ? "" : "NONE";
    return treeObject.AppendNode( tmpName,tmpUrl,tmpID,display,tmpHasChilds,tmpLevels,nLocation,bHasParent,index < nodesLength, parentNode  );
}

 调用方法：

    setTreeStyle();
     var  tmp  =   new  RequestHandler(  '' , ' RequestXmlData.aspx ' , ' ID ' , '' , null , ' Channel ' , ' _blank ' , ' #eeeeee '  ); 
    tmp.RequestData();