本帖最后由 采星 于 2014-5-28 11:16 编辑
后台获取动态数据加载到树
树是一个js对象[不是很清楚]
[JavaScript] 纯文本查看 复制代码 function OrgNode(){
this.Text=null;
this.Link=null;
this.Description=null;
this.BoxWidth=null;
this.BoxHeight=null;
this.parentNode=null;
this.NodeGroupId=null; //同一层的级别序号,从零开始
this.NodeOrderId=null; //同一级中的序号,从零开始
this.TopLine=null;
this.BottomLine=null;
this.Depth=null;
this.Top=null;
this.Left=null;
this.Type=null;
this.Nodes=[];
this.customParam=[]; //节点自定义参数
var This=this;
this.Nodes.Add=function(OrgNode_){
OrgNode_.parentNode=This;
This.Nodes[This.Nodes.length]=OrgNode_;
}
this.Box=null;
this.Templet=null;
this.Id="OrgNode_"+ GetRandomId(20);
this.inIt= function(){
if(this.inIted==true)return;
var tempDiv=document.createElement("DIV");
document.body.appendChild(tempDiv);
var tempHTML=this.Templet;
tempHTML=tempHTML.replace("{Id}", this.Id);
tempHTML=tempHTML.replace("{Text}", this.Text);
tempHTML=(this.Link==null)?tempHTML.replace("{Link}", "JavaScript:void(0)"):tempHTML.replace("{Link}", this.Link);
tempHTML=tempHTML.replace("{Description}", this.Description);
for(var Param_ in this.customParam){
tempHTML=tempHTML.replace("{"+ Param_ +"}", this.customParam[Param_]);
}
tempDiv.innerHTML=tempHTML;
//$("#LoadBox1").appendChild(tempdiv);
this.Box=do_(this.Id);
if(this.BoxWidth!=null){
if(offset(this.Box).w < this.BoxWidth){
this.Box.style.width=this.BoxWidth +"px";
if(offset(this.Box).w > this.BoxWidth){
this.Box.style.width=(this.BoxWidth - (offset(this.Box).w - this.BoxWidth)) +"px";
}
}
}
if(this.BoxHeight!=null){
if(offset(this.Box).h < this.BoxHeight){
this.Box.style.height=this.BoxHeight +"px";
if(offset(this.Box).h > this.BoxHeight){
this.Box.style.height=(this.BoxHeight - (offset(this.Box).h - this.BoxHeight)) +"px";
}
}
}
this.Width=offset(this.Box).w;
this.Height=offset(this.Box).h;
this.inIted=true;
}
function GetRandomId(n_){
var litter="abcdefghijklmnopqrstuvwxyz"
litter+=litter.toUpperCase()
litter+="1234567890";
var idRnd="";
for(var i=1; i<=n_; i++){
idRnd+=litter.substr((0 + Math.round(Math.random() * (litter.length - 0))), 1)
}
return idRnd;
}
}
静态添加是这样的 OrgNode 是一个方法 内部有属性和nodes[] 方法nodes.add [JavaScript] 纯文本查看 复制代码 var lev_1=new OrgNode();
lev_1.Text="测试三是的是多少<br/>(56)";
lev_1.Link="1";
lev_1.Description = "t";
//---------------------------------------------------------------
var lev_2_1=new OrgNode();
lev_2_1.Text="Thermal";
lev_2_1.Link="2";
var lev_2_2=new OrgNode();
lev_2_2.Text="Wind";
lev_2_2.Link="3";
var lev_2_3=new OrgNode();
lev_2_3.Text="Aero";
lev_2_3.Link="4";
var lev_2_4=new OrgNode();
lev_2_4.Text="Jenbacher";
lev_2_4.Link="5";
var lev_2_5=new OrgNode();
lev_2_5.Text="Water";
lev_2_5.Link="6";
//---------------------------------------------------------------
lev_1.Nodes.Add(lev_2_1);
lev_1.Nodes.Add(lev_2_2);
lev_1.Nodes.Add(lev_2_3);
lev_1.Nodes.Add(lev_2_4);
lev_1.Nodes.Add(lev_2_5);
//---------------------------------------------------------------
var lev_3_1=new OrgNode();
lev_3_1.Text="Gas Turbine";
lev_3_1.Link="7";
var lev_3_2=new OrgNode();
lev_3_2.Text="Licensing";
lev_3_2.Link="8";
var lev_3_3=new OrgNode();
lev_3_3.Text="Aero Bim";
lev_3_3.Link="9";
var lev_3_4=new OrgNode();
lev_3_4.Text="CMS";
lev_3_4.Link="10";
var lev_3_5=new OrgNode();
lev_3_5.Text="ES";
lev_3_5.Link="11";
//---------------------------------------------------------------
lev_2_1.Nodes.Add(lev_3_1);
lev_2_1.Nodes.Add(lev_3_2);
lev_2_3.Nodes.Add(lev_3_3);
lev_2_5.Nodes.Add(lev_3_4);
lev_2_5.Nodes.Add(lev_3_5);
//---------------------------------------------------------------
var lev_4_1=new OrgNode();
lev_4_1.Text="Chemical";
lev_4_1.Link="12";
var lev_4_2=new OrgNode();
lev_4_2.Text="AI";
lev_4_2.Link="13";
var lev_4_3=new OrgNode();
lev_4_3.Text="ES Direct";
lev_4_3.Link="14";
var lev_4_4=new OrgNode();
lev_4_4.Text="ES Indirect";
lev_4_4.Link="15";
//---------------------------------------------------------------
lev_3_4.Nodes.Add(lev_4_1);
lev_3_4.Nodes.Add(lev_4_2);
lev_3_5.Nodes.Add(lev_4_3);
lev_3_5.Nodes.Add(lev_4_4);
我想要通过后台获取的json数据[json格式如下] 来动态创建这样的lev_1数据
json数据是如下的格式
[JavaScript] 纯文本查看 复制代码 [{Link:1,parentID:0,Text:"test"},
{Link:2,parentID:0,Text:"进击"},
{Link:3,parentID:0,Text:"测试"},
{Link:4,ParentID:1,Text:"11"},
{Link:5,parentID:2:Text:"21"},
{Link:6:parentID:3,Text:"31"},
{link:7,parentID:4,text:"111"}
]
|