利用数据岛生成动态的树

<#import "/common/bossMacros.ftl" as boss>
<@boss.html title=''> 
<style type="text/css">
body {
 margin-left: 0px;
 margin-top: 0px;
 text-align: left;
 border-top-style: none;
 border-right-style: none;
 border-bottom-style: none;
 border-left-style: none;
 height: auto;
 widows: 250px;
 top: 0px;
}
</style>
<xml id="tree">
 <tree treeType="<@ww.property value="treeType"/>" rootId="<@ww.property value="rootId"/>">
 <@ww.iterator id="treeList" value="trees">
  <node>
   <node_title><@ww.property value="node_title"/></node_title>
   <node_po_id><@ww.property value="node_po_id"/></node_po_id>
   <node_type><@ww.property value="node_type"/></node_type>
   <node_level><@ww.property value="node_level"/></node_level>
  </node>   
 </@ww.iterator>
 </tree>
</xml>
<SCRIPT language="JavaScript" src="/system/js/tree.js"></SCRIPT> 
<body οnlοad="show(<@ww.property value="rootId"/>,0)">
 <div id="TreeContent">  
  <script language="javascript">
      createTree();
  </script>
 </div>
</body>
</@boss.html>


var treeType="";
var rootId="";

img1="/images/tree/fold.gif"
img2="/images/tree/open.gif"

function change(id){
 
    var div=document.getElementById("div"+id);
    var img=document.getElementById("img"+id);
    //alert(div.innerHTML)
    if(div.style.display=="none"){
     div.style.display="";
     if(div.innerHTML!=""){
      img.src=img2;
     }
    }else{
     div.style.display="none";
     if(div.innerHTML!=""){
      img.src=img1;
     }
    }
}


function createTree() { 
   // alert(id);
 var root = tree.documentElement;
 var dataRows = root.childNodes.length;
 treeType=root.getAttribute('treeType');
 rootId=root.getAttribute('rootId');
 var strTree="";
 var level;
 
 
 if(dataRows==1){
  var node_title = root.childNodes[0].childNodes[0].text;
  var node_po_id   = root.childNodes[0].childNodes[1].text;
  var node_type = root.childNodes[0].childNodes[2].text;
  var node_level = root.childNodes[0].childNodes[3].text;
  strTree = strTree+"<span id=/"span"+node_po_id+"/" οnmοuseοver=/"this.style.cursor='hand'/"  ><img id=/"img"+node_po_id+"/" src=/""+img2+"/"/><span id=/"function"+node_po_id+"/" οnclick=/"change("+node_po_id+"),show("+node_po_id+","+node_level+");/" ><span id=/"title"+node_po_id+"/">"+node_title+"</span></span></span><br id=/"br"+node_po_id+"/"/>";
     strTree = strTree+"<div id=/"div"+node_po_id+"/"  style=/"display: none;/"></div>";
 }else{
  for(var i=0;i<dataRows - 1 ;i++){
   var node_title = root.childNodes[i].childNodes[0].text;
   var node_po_id   = root.childNodes[i].childNodes[1].text;
   var node_type = root.childNodes[i].childNodes[2].text;
   var node_level = root.childNodes[i].childNodes[3].text;
   var strnbsp="";
   if(i!=0){
    for(j=node_level;j<level;j++){
     strTree = strTree+"</div>";
    }
  
   }
   
   
   for(j=0;j<node_level;j++){
    strnbsp=strnbsp+"&nbsp;&nbsp;&nbsp;&nbsp;";
   }
   if(node_type!="Y"){
    strTree = strTree+"<span id=/"span"+node_po_id+"/" οnmοuseοver=/"this.style.cursor='hand'/"  >"+strnbsp+"<img id=/"img"+node_po_id+"/" src=/""+img1+"/"/><span id=/"function"+node_po_id+"/" οnclick=/"change("+node_po_id+"),show("+node_po_id+","+node_level+");/" ><span id=/"title"+node_po_id+"/">"+node_title+"</span></span></span><br id=/"br"+node_po_id+"/"/>";
    strTree = strTree+"<div id=/"div"+node_po_id+"/" style=/"display: none;/">";
   }else{
    strTree = strTree+"<span id=/"span"+node_po_id+"/" οnmοuseοver=/"this.style.cursor='hand'/"  >"+strnbsp+"<img id=/"img"+node_po_id+"/" src=/""+img2+"/"/><span id=/"function"+node_po_id+"/" οnclick=/"change("+node_po_id+"),show("+node_po_id+","+node_level+");/" ><span id=/"title"+node_po_id+"/">"+node_title+"</span></span></span><br id=/"br"+node_po_id+"/"/>";
    strTree = strTree+"<div id=/"div"+node_po_id+"/"  style=/"display: none;/"></div>";
   }
   if(i+1==dataRows - 1){
    for(j=0;j<node_level;j++){
     strTree = strTree+"</div>";
    }
   }
   level=node_level;
  }
 }
 
 //alert(strTree);
 document.getElementById("TreeContent").innerHTML=strTree;
 
}


function show(id,level){
 var content = window.parent.content;
 if(treeType=="organizationTree"){
  //alert("aaaaaaaaaaaaaaaaaaaa");
  content.location="/system/orgTreeManagerAction.action?orgId="+id+"&action=show&level="+level;
 }else{
  content.location="/system/resionManagerAction.action?resId="+id+"&action=show&level="+level;
 }
 
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值