JS树+Asp.Net=动态树Tree.aspx

<%@ Page language="c#" Codebehind="Tree.aspx.cs" AutoEventWireup="false" Inherits="ViewIETM.Tree" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
    <title>Tree</title>
    <meta content="Microsoft Visual Studio .NET 7.1" name="GENERATOR">
    <meta content="C#" name="CODE_LANGUAGE">
    <meta content="JavaScript" name="vs_defaultClientScript">
    <meta content="http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">
    <style> .Node { }
.Node span { font-size:12px; font-family:Verdana; cursor:default; margin-left:3px; height:17px; width:1px; }
.Node span a { padding:1 4; width:100%; height:100%; }
.Node-unselect { border:0px solid #EAEAEA; background-color:transparent; color:windowText; }
.Node-selected { border:1px solid windowText; background-color:HighLight; color:HighLightText; }
.Node-unselect a { text-decoration:none; color:windowtext; }
.Node-unselect a:hover { color:#3366cc; text-decoration:underline; }
.Node-selected a { color:#FFFFFF; text-decoration:none; width:100%; height:100%; }
.Node-selected a:hover { color:HighLightText; text-decoration:underline; }
<!-- .td{ background-color:#CCCCCC; width:1px; height:1px; cursor:pointer; }
.menuover{ background-color:#316AC5; color:#FFFFFF; cursor:pointer; }
.menuout{ background-color:#ffffff; color:#000000; }
.textover{ background-color:#b8d0e2; }
.textout{ background-color:#ffffff; }
body,td,th { font-size: 13px; }
-->
    </style>
    <link href='default.css' type="text/css" rel="stylesheet">
</HEAD>
<BODY>
    <input type="text" id="txtContent" runat="server" class="textbox" style="WIDTH: 96px; HEIGHT: 19px"
     size="10"><input type="button" value="搜索" class="button">
    <div id="tree"><FONT face="宋体"></FONT></div>
    <SCRIPT language="JavaScript">

function treeview(id,path,drag){
    var me     = this;
    var target    = null;
    this.nodes    = new node("root","roottag").nodes;
    this.id     = id?id:"";
    this.icon    = true;
    this.selected = null;
    this.path    = path?path:"";
    //this.selected = null;
    this.dragTo    = null;
    this.dragFrom = null;
    this.drag    = drag?true:false;
    //this.check    = check?true:false;

    var icons = {
     root :'root.gif',
     open :'folderopen.gif',
     close :'folder.gif',
     file :'file.gif',
     rplus :'rplus.gif',
     rminus :'rminus.gif',
     join :'t.gif',
     joinbottom:'l.gif',
     jointop :'r.gif',
     plus :'tplus.gif',
     plusbottom:'lplus.gif',
     minus :'tminus.gif',
     minusbottom:'lminus.gif',
     blank :'blank.gif',
     line :'I.gif'
    };

    this.Ficons = {};

    for(i in icons){
     this.Ficons[i]= new Image()
     this.Ficons[i].src= path + "/" + icons[i];
    }

    this.create    = function(oTarget){
     if(oTarget){
      for(var i=0;i<this.nodes.length;i++){
       oTarget.appendChild(this.nodes.items[i].toString(me));     
      }
      target = oTarget;
     }
    }
    this.add = function(oo){
     this.insert(this.nodes.length,oo);
    }
    this.insert = function(index,oo){
     if(index>=0&&index<=this.nodes.length){
      var pre = null;
      if(index<this.nodes.length){
       pre = this.nodes.items[index].baseNode;
      }

      this.nodes.insert(index,oo);   
      if(target){
       if(index==this.nodes.length){
        target.appendChild(oo.toString());
       }else{
        if(pre){
         target.insertBefore(oo.toString(),pre);
        }
       }
      }
     }
    }
}

//event
treeview.prototype.onnodeclick    = function(sender){}
treeview.prototype.onnodeexpand    = function(sender){}
treeview.prototype.onnodecollapse = function(sender){}
treeview.prototype.onnodedblclick = function(sender){sender.toggle();return false;}
treeview.prototype.onnodeafteredit = function(sender,oldstr){}
treeview.prototype.onnodebeforeedit = function(sender,oldstr,newstr){}
treeview.prototype.onnodedrag    = function(from,to){}
treeview.prototype.onnodekeydown = function(sender,e){  
    var e=e||event;
    switch(e.keyCode){
     case 61: //fx +
     case 187: //=
     case 107: //number +
      sender.expand();
      break;
     case 109: //number -
     case 189: //-
      sender.collapse();
      break;
     case 38: //up    
      if(sender.previous()){
       sender.previous().select();
      }else{
       if(sender.parent&&sender.parent.level>=0){
        sender.parent.select();
       }
      }
      break;
     case 40: //down    
      if(sender.next()){
       sender.next().select();
      }
      break;
     case 37: //left    
      if(sender.parent&&sender.parent.level>=0){
       sender.parent.select();
      }
      break;
     case 39: //right    
      if(sender.firstChild()){
       sender.firstChild().select();
      }else{
       if(sender.next()){
        sender.next().select();
       }     
      }
      break;
    }
}
treeview.prototype.onnodemousedown = function(sender,e){}
treeview.prototype.onnodemouseup = function(sender,e){}
treeview.prototype.oncontextmenu = function(sender){}
treeview.prototype.onnodecheck    = function(sender){}
treeview.prototype.onselectchange = function(before,after){}

//class node
function node(caption,title,url,fatherid,target,tag,callback){
    var me    = this;
    this.nodes = new nodes();
    this.id    = getid();
    this.caption= caption;
    this.title = title?title:caption;
    this.fatherid     = fatherid?fatherid:"未定义父ID值,请检查!";
    this.parent = null;
    this.tag = tag?tag:"";
    this.loaded = false;  
    this.level    = -1;
    this.isLast = false;
    this.opened = false;
    this.showed = false;
    //this.checked= false;
    this.indent = [];

  
    var contol    = null;
    this.container = document.createElement("div");

    this.baseNode = null;
    this.handleNode = null;
    this.folderNode = null;
    this.textNode = null;
    this.checkNode = null;
    this.url = url?url:"WorldTime.htm";

    //get the id by rand
    function getid(){
     var a = Math.random() + "";
     var b = Math.random() + "";
     var c = Math.random() + "";
     var d = Math.random() + "";

     return a.substr(2,8) + "-" + b.substr(2,8) + "-" + c.substr(2,8) + "-" + d.substr(2,8);   
    }
    //node collection
    function nodes(){
     var n = [];
     //get the lenght of the collection
     this.length = {valueOf:function(){return n.length;},toString:function(){return n.length;}}

     this.toString = function(){
        return n.toString();
     }
     //insert a node at index
     this.insert = function(index,oo){
      if(index>=0&&index<=n.length){
       var ol = n.length;
   
       oo.parent = me;
       oo.level    = me.level+1;
     
       if(index>=n.length){
        oo.isLast = true;
        if(n.length>0){
         n[n.length-1].isLast = false;
         n[n.length-1].setIndent(n[n.length-1].level,n[n.length-1].isLast);
         n[n.length-1].refresh(0);
        }
       }else{
        oo.isLast = false;
       }
       oo.indent = me.indent.concat();
       oo.indent[oo.indent.length]=oo.isLast;

       if(oo.nodes.length>0){
        refreshchildindent(oo);
       }

       function refreshchildindent(node){
        for(var i=0;i<node.nodes.length;i++){
         node.nodes.items[i].indent = node.indent.concat();
         node.nodes.items[i].indent[node.nodes.items[i].indent.length] = node.nodes.items[i].isLast;
         if(node.nodes.items[i].nodes.length>0){
          arguments.callee(node.nodes.items[i]);
         }
        }
       }
     

       if(me.loaded){   
        if(index==n.length){
         me.container.appendChild(oo.toString());
        }else{
         var pre = n[index].baseNode;
         if(pre){
          me.container.insertBefore(oo.toString(),pre);
         }
        }
       }
       n.splice(index,0,oo);
       if(ol==0){      
        me.refresh(0);
       }
      }
      return me;
     }
     //add a node after the last node
     this.add = function(oo){  
      return this.insert(n.length,oo);
     }
     //remove a node by node
     this.remove = function(node){
      if(node){
       for(var i=0;i<n.length;i++){
        if(n[i] ==node){
         this.removeAt(i);
        }
       }
      }
      alert("ID: "+node.id+" FatherID: "+node.fatherid+" URL: "+node.url+" Caption: "+node.caption);
      document.Form1.hdTempText.value=node.id;
      document.Form1.btnDelete.click();
    
     }
     //remove a node at index
     this.removeAt = function(index){
      if(index>=0&&index<n.length){     
       if(index>0&&index==n.length-1){
        n[index-1].isLast = true;
        n[index-1].setIndent(n[index-1].level,n[index-1].isLast);
       }
       n[index].nodes.removeChildren();

       var c = n[index];
       if(c.showed){
        if(control){
         if(c==control.selected){
          if(index>0){
           control.selected = c.previous();
          }else{
           control.selected = c.next();
          }
          if(!control.selected){
           if(c.parent.level>=0){
            control.selected = c.parent;
           }         
          }
          if(control.selected)control.selected.select();
         }
        }
        var oNode = c.baseNode;
        if (oNode) {oNode.parentNode.removeChild(oNode); }
       }
       n.splice(index,1);   
     
       if(n.length>0){
        var o = n[n.length-1];
         o.isLast = true;
         o.setIndent(o.level,o.isLast);

        if(o.showed){o.refresh(0);}
       }else{
        me.loaded = false;
        me.opened = false;
        me.container.style.display = "none";
        me.refresh(0);
       }     
      }
     }    
     this.removeChildren = function (){
      for(var i=n.length-1;i>=0;i--){
       var o = me.nodes.items[i];
        o.nodes.removeChildren();
       if(o.showed){
        if(control){
         if(o==control.selected){
          control.selected = this;
         }
        }
        var oNode = me.baseNode;
        if (oNode) {oNode.parentNode.removeChild(oNode); }
       }
      }  
      n.length = 0;
     }
     this.items = n;
    }
    this.add = function(oo){
     return this.nodes.add(oo);
    }
    this.insert = function(index,oo){
     return this.nodes.insert(index,oo);
    }
    this.remove = function(){
     this.parent.nodes.remove(this);
    }
    //set the caption of the node
    this.setCaption = function(sText,sTitle){
     if(this.showed){
      var oNode = this.textNode;
       if(oNode){
        oNode.firstChild.innerHTML = sText;
        oNode.title       = typeof(sTitle)!="undefined"?sTitle:sText;
       }
     }
     this.caption = sText;
    }
    //get then deepth of the node
    this.deepth = function(){
     var i = -1;
     var p = me;
     do{
      p = p.parent;
      i++;
     }while(p!=null);

     return i;
    }
    //get root node
    this.root = function(){
     var p = me;
     do{
      if(p.level>0){
       p = p.parent;
      }else{
       break;
      }
     }while(p!=null);   
     return p;
    }

    this.toString = function(tv){

     if(tv){
      control = tv;
     }

     var oNode     = document.createElement("div");
      document.body.appendChild(oNode);

      oNode.className = "Node";
      oNode.noWrap = true;
      oNode.onselectstart = function(e){ e = e||event;return typeof(e.srcElement.type)!="undefined"&&e.srcElement.type=="text";}
      oNode.oncontextmenu = function(e){ return treeview.prototype.oncontextmenu(me);}

      for(var i=0;i<this.indent.length-1;i++){
       var iIcon = document.createElement("img");
        iIcon.align = "absmiddle";
        iIcon.src = this.indent[i]?control.Ficons.blank.src:control.Ficons.line.src;

       oNode.appendChild(iIcon);
      }

     var hIcon     = document.createElement("img");
      oNode.appendChild(hIcon);

      hIcon.align    = "absmiddle";      
      hIcon.src    = me.nodes.length>0?(me.opened?(me.level>0?(me.isLast?control.Ficons.minusbottom.src:control.Ficons.minus.src):(me.isLast?control.Ficons.minusbottom.src:control.Ficons.rminus.src)):(me.level>0?(me.isLast?control.Ficons.plusbottom.src:control.Ficons.plus.src):(me.isLast?control.Ficons.plusbottom.src:control.Ficons.rplus.src))):(me.level>0?(me.isLast?control.Ficons.joinbottom.src:control.Ficons.join.src):me.isLast?control.Ficons.joinbottom.src:control.Ficons.join.src);
      hIcon.onclick = function(){me.toggle();};
    

     var fIcon     = document.createElement("img");
      oNode.appendChild(fIcon);
      fIcon.align    = "absmiddle";
      fIcon.src    = me.icon?this.icon:(me.nodes.length>0?(me.opened?control.Ficons.open.src:control.Ficons.close.src):control.Ficons.file.src);
      fIcon.onclick = function(e){ me.select();return treeview.prototype.onnodeclick(me);};
      fIcon.ondblclick= function(e){ return treeview.prototype.onnodedblclick(me);};

     if(control&&control.check){

      var iCheck     = document.createElement("input");
       iCheck.type    = "checkbox";
       iCheck.checked = me.checked;
       iCheck.onclick = function(){me.checked=!me.checked; treeview.prototype.onnodecheck(me);}
       oNode.appendChild(iCheck);

      this.checkNode = iCheck;
     }

     var eText     = document.createElement("span");
      oNode.appendChild(eText);
     var eA      = document.createElement("a");
      eText.appendChild(eA);

      eA.innerHTML = me.caption?me.caption :"";
      eA.target    = me.target?me.target :"";
      eA.href     = me.action?me.action :"";
      eA.onkeydown = function(e){ return treeview.prototype.onnodekeydown(me,e);}
      eA.ondblclick = function(e){ return treeview.prototype.onnodedblclick(me);}
      eA.onmousedown    = function(e){ return treeview.prototype.onnodemousedown(me)}
      eA.onmouseup = function(e){ return treeview.prototype.onnodemouseup(me);}
      eA.onclick    = function(e){me.select();return treeview.prototype.onnodeclick(me);};
      eA.onfocus    = function(e){
       var before = null;
       if(control){
        before = control.selected;
        if(control.selected)control.selected.unselect();      
        control.selected=me;
       }
       if(before!=me)treeview.prototype.onselectchange(before,me);
       me.select();
      }

      eA.ondragstart = function(e){if(control.drag){var oData = window.event.dataTransfer;oData.effectAllowed = "move";oData.dropEffect ="none";control.dragFrom = me;control.dragTo=null;}}
      eA.ondragenter    = function(e){if(control.drag){control.dragTo = me;me.select();}}
      eA.ondragend = function(e){if(control.drag){if(control.dragFrom!=control.dragTo&&control.dragTo!=null){treeview.prototype.onnodedrag(control.dragFrom,control.dragTo);}}}
      eText.className = "Node-unselect";
      eText.title    = me.title;
      eText.ondragover= function(e){if(control.drag){var oEvent = window.event;oEvent.returnValue = false;}}

      me.container.style.display = me.opened?"":"none";

      oNode.appendChild(me.container);
      me.showed = true;

      this.baseNode = oNode;
      this.handleNode = hIcon;
      this.folderNode = fIcon;
      this.textNode = eText;

      return oNode;    
    }

this.edit = function(){

     if(control.selected!=this)this.select();
      AAAAAA.href="./Node/EditNode.aspx?ID="+me.id;
      AAAAAA.target="Main";
      AAAAAA.click();  
    }

    //expand the node
    this.expand = function(){
     if(this.nodes.length>0){
      if(!this.opened){
       this.opened = true;
       //if(Global.cookieless==false){
       // setCookie("Node"+this.id,1);
       //}

       if(!me.loaded){
        var p = me.parent;   
        if(p&&!p.opened&&p.level>=0){
         p.expand();
        }
        this.refresh(1);
        this.loaded=true;
       }else{
        this.refresh(0);
       }
       this.container.style.display = "block";
       treeview.prototype.onnodeexpand(this);
      }
     }   
    }
    //collapse the node
    this.collapse = function(){
     this.opened= false;
     treeview.prototype.onnodecollapse(this);
     //if(Global.cookieless==false){
     // setCookie("Node"+this.id,0);
     //}
     this.container.style.display = "none";
     this.refresh(0);
    }
    this.toggle = function(){
     if(this.nodes.length>0){
      if(!this.opened){
       this.expand();
      }else{
       this.collapse();
      }
     }
    }
    //node is my parent
    this.isParent = function(node){
     var p = me.parent;
     while(p!=null){
      if(p==node){
       return true;
      }
      p = p.parent;
     }
     return false;   
    }
    this.setIndent = function(level,value){
     this.indent[level] = value;
     for(var i=0;i<this.nodes.length;i++){    
      this.nodes.items[i].indent[level] = value;
      if(this.nodes.items[i].showed){     
       var ic = this.nodes.items[i].baseNode.childNodes;    
       for(var j=0;j<this.nodes.items[i].indent.length-1;j++){
        if(ic[j].tagName=="IMG"){
         ic[j].src = this.nodes.items[i].indent[j]?control.Ficons.blank.src:control.Ficons.line.src;
        }
       }
      }
      this.nodes.items[i].setIndent(level,value);
     }   
    }
    this.select = function(){
     if(this.parent){  
      this.parent.expand();
     }

     var oNode = this.textNode;
      if(oNode){
       oNode.className = "Node-selected";
       var of = oNode.firstChild;
     
       try{of.focus();}catch(e){}
      }      
    }
    this.unselect = function(){
     if(this.showed){
      var oNode = this.textNode;
       if(oNode){
        oNode.className = "Node-unselect";
        oNode.firstChild.blur();
       }
     }
    }

    this.refresh = function(loadchild){
     if(this.showed){
      if(loadchild){
       //reload all children
       for(var j=0;j<this.nodes.length;j++){     
        this.container.appendChild(this.nodes.items[j].toString());
        this.container.style.display=this.opened?"":"none";     
       }   
      }
      //reload me
      if(this.handleNode){
       this.handleNode.src = me.nodes.length>0?(me.opened?(me.level>0?(me.isLast?control.Ficons.minusbottom.src:control.Ficons.minus.src):(me.isLast?control.Ficons.minusbottom.src:control.Ficons.rminus.src)):(me.level>0?(me.isLast?control.Ficons.plusbottom.src:control.Ficons.plus.src):(me.isLast?control.Ficons.plusbottom.src:control.Ficons.rplus.src))):(me.level>0?(me.isLast?control.Ficons.joinbottom.src:control.Ficons.join.src):me.isLast?control.Ficons.joinbottom.src:control.Ficons.join.src);
      }
      if(this.folderNode){
       if (!this.icon){
        this.folderNode.src = this.nodes.length>0?(this.opened?control.Ficons.open.src:control.Ficons.close.src):control.Ficons.file.src;
       }
      }
     }
    }
    //move to be my child
    this.moveToChild = function(node){
     if(node){
      if(this.isParent(node)==false){
       if(this.opened){
        this.expand();
       }
       var c = node.clone();
         node.remove();

       this.add(c);    
      }
     }
    }
    this.clone = function(){
     var c = new node(this.caption,this.title,this.url,this.target,this.tag);
      copy(this,c);    
      function copy(src,obj){
       for(var i=0;i<src.nodes.length;i++){
        var s = src.nodes.items[i];
        var z = new node(s.caption,s.title,s.url,s.target,s.tag);
         z.loaded = false;       
         obj.add(z);
        if(s.nodes.length){
         arguments.callee(s,z);
        }
       }  
      }
      return c;
    }
    this.firstChild = function(){
     if(this.nodes.length>0){
      return this.nodes.items[0];
     }else{
      return null;
     }
    }
    this.lastChild = function(){
     if(this.nodes.length>0){
      return this.nodes.items[this.nodes.length-1];
     }else{
      return null;
     }
    }
    this.next = function(){
     var p = this.parent;
     for(var i=0;i<p.nodes.length;i++){
      if(p.nodes.items[i] == this){
       if(i<p.nodes.length-1){
        return p.nodes.items[i+1];
       }
      }
     }
     return null;
    }
    this.previous = function(){
     var p = this.parent;
     for(var i=0;i<p.nodes.length;i++){
      if(p.nodes.items[i] == this){
       if(i>0){
        return p.nodes.items[i-1];
       }
      }
     }
     return null;
    }
}

var tv = new treeview("treeview","tree",true);
<%=tree%>
tv.nodes.items[0].selected = true;
tv.nodes.items[0].className = "Node-selected";
tv.nodes.items[0].select();
tv.nodes.items[0].open = true;



    //焦点聚集到树里的节点链接时的处理
    //id 客户端节点 id
    treeview.prototype.onnodeclick= function(tvnode)
    {
   
      if(tvnode.url=="#")return;
      this.focusClientNode(tvnode);
      return false;
    };
    //oncontextmenu="menu_show(this.id);
    treeview.prototype.oncontextmenu=function(thetextid){

     document.all.menu_rename.name = thetextid;
     document.all.menudiv.style.display = '';
     document.all.menudiv.style.left = event.clientX-3;
     document.all.menudiv.style.top    = event.clientY-3;
     return false;

    }
    //聚集到客户端生成的某个节点上
    //id    客户端树节点的id
    treeview.prototype.focusClientNode        = function(tvnode)
    {
     //alert(tvnode.caption +"ID: "+tvnode.id+" URL:"+ tvnode.url);
     if(tvnode.url!="#")
     {
      AAAAAA.href = tvnode.url;
      AAAAAA.target = "Main";
      AAAAAA.click();
     }
  
  
    };
  
  
    treeview.prototype.onselectchange = function(before,after){
    }

//    treeview.prototype.onnodekeydown = function(sender,e){var e = event||e;alert(e.keyCode);}
    treeview.prototype.onnodedrag    = function(from,to){
     to.moveToChild(from);
    }

  

    function add(){
     var nn = tv.selected;
     if(!nn)nn=tv;
   
     AAAAAA.href="./Node/AddNewNode.aspx?fatherID="+nn.id;
     AAAAAA.target="Main";
     AAAAAA.click();
   
   
    }

    function insert(nn){
     var nn = tv.selected;
     if(!nn)nn=tv;
     nn.insert(0,new node("廖桥军版权"));
     
    }
    function refresh()
    {
     location.href="tree.aspx";
    }

    tv.create(document.getElementById("tree"));

    //-->
    </SCRIPT>
    <div id="menudiv" style="DISPLAY: none; POSITION: absolute" onMouseOut="if(!this.contains(event.toElement))this.style.display='none';">
     <table style="BORDER-COLLAPSE: collapse" borderColor="#bbbbbb" cellSpacing="0" cellPadding="4"
      width="70" bgColor="#ffffff" border="1">
      <colgroup align="center">
      </colgroup>
      <tr>
       <td id="menu_copy" onMouseOver="this.className='menuover';" onClick="if(tv.selected)alert('你选择的节点是:' +tv.selected.caption)"
        onmouseout="this.className='menuout';">显示</td>
      </tr>
      <tr>
       <td id="menu_del" onMouseOver="this.className='menuover';" onClick="add()" onMouseOut="this.className='menuout';">增加</td>
      </tr>
      <tr>
       <td id="menu_copy" onMouseOver="this.className='menuover';" onClick="if(tv.selected){tv.selected.edit();}"
        onmouseout="this.className='menuout';">编辑</td>
      </tr>
      <tr>
       <td id="menu_del" onMouseOver="this.className='menuover';" onClick="if(tv.selected)tv.selected.remove()"
        onmouseout="this.className='menuout';">删除</td>
      </tr>
      <tr>
       <td id="menu_rename" onMouseOver="this.className='menuover';" onClick="refresh()" onMouseOut="this.className='menuout';">刷新</td>
      </tr>
     </table>
    </div>
    <script language="javascript">
function AddNewNode(id,fatherid,text,url)
{
alert("ID: "+id+" FatherID: "+fatherid+" Text: "+text+"URL: "+url);
btnAddNewNode.click();
}
function LinkToOrtherPage(url)
{
location.href=url;
}
function EditNode(id,text)
{
alert("This is New Node Property: ID: "+id+" Text: "+text);
}
function DeleteNode(id)
{
alert("Delete Node's ID : "+id);
}
function expendedNode()
{
if(tv.nodes.length>0)
for(var i=0;i<tv.nodes.length;i++)
{
tv.nodes.items[i].opened = true;
tv.nodes.items[i].expand();
}
}
//以下二个方法,是递归获取所有的节点的名字和ID
var text = "";
function getAllNodes()
{
text = "";

if(tv.nodes.length>0)
{
    getNodes(tv.nodes.items[0]);
  
  
}
alert(text);
}
function getNodes(tvnode)
{
var temptext = "";
text += tvnode.caption;
if(tvnode.nodes.items[0]!=null)
{
    for(var i=0;i<tvnode.nodes.length;i++)
    {
     text += tvnode.nodes.items[i].caption;
     if(tvnode.nodes.items[i].nodes.items[0]!=null )
     {
    
       for(var j=0;j<tvnode.nodes.items[i].nodes.length;j++)
       {
        //text += tvnode.nodes.items[i].nodes.items[j].caption;
        getNodes(tvnode.nodes.items[i].nodes.items[j]);
       }
     }
    }
}
}

    </script>
    <form id="Form1" name="Form1" method="post" runat="server">
     <table id="TempTable" runat="server" style="DISPLAY:none">
      <tr>
       <td><input id="hdTempText" type="hidden" value="专门用于临时存储" name="hdTempText" runat="server">
        <input id="btnAddNewNode" type="button" value="增加新的节点" name="btnAddNewNode" runat="server">
        <input id="btnGetAllNodes" onClick="getAllNodes();" type="button" value="提取所有树节点">
        <input id="btnDelete" type="button" value="删除" name="btnDelete" runat="server"> <input id="btnEditNode" type="button" value="编辑节点" name="btnEditNode" runat="server">
        <A id="AAAAAA" href="" target="Main">超链接</A>
       </td>
      </tr>
     </table>
    </form>
</BODY>
</HTML>

AddNewNode.aspx.cs文件

private void Page_Load(object sender, System.EventArgs e)
    {
     if(this.IsPostBack)return;
     if(Request.Params["fatherID"]!=null)
      if(Request.Params["fatherID"].ToString().Trim()!="")
      {
       string fatherID = Request.Params["fatherID"].ToString();
       sql = "insert into info(fatherID,caption)values("+fatherID+",'新节点')";
       ado.ExecuteNonQuery(sql);
       sql="select top 1 id from info order by id desc";
       object obj = ado.ExecuteScalar(sql);
       ViewState["ID"]=obj;
       this.txtID.Text = obj.ToString();
       this.txtFatherID.Text = Request.Params["fatherID"].ToString();
       this.txtURL.Text = "ShowPage.aspx?ID="+obj.ToString();
       sql = "update info set url='"+this.txtURL.Text+"' where id = "+obj.ToString();
       ado.ExecuteNonQuery(sql);
      }
    }

    private void btnSave_Click(object sender, System.EventArgs e)
    {
     if(this.txtCaption.Text.Trim()=="")
     {
      Page.RegisterStartupScript("","<script>alert('节点名称不能为空!!!');</script>");
      return;
     }
     File1.PostedFile.SaveAs(Server.MapPath("..//DownLoad//"+Path.GetFileName(File1.Value)));
     url = "./DownLoad/"+Path.GetFileName(File1.Value);
     sql="update info set caption='"+txtCaption.Text+"',fatherID='"+txtFatherID.Text+"',url='"+txtURL.Text+"',img='"+url+"',remark='"+txtRemark.Text+"' where id="+this.txtID.Text;
     ado.ExecuteNonQuery(sql);
     //Response.Write("<table style='display:none'><tr><td><a id='abbc' href='./Tree.aspx' target='Left'>aaa</a><script>abbc.click();</script></td></tr></table>");
     Response.Write("<script>parent.Left.location.href='http://localhost/ViewIETM/Tree.aspx';</script>");
     Response.Redirect("..//ShowPage.aspx?ID="+txtID.Text);
    }

EditNode.aspx.cs文件

private void Page_Load(object sender, System.EventArgs e)
    {
     if(this.IsPostBack)return;
     if(Request.Params["ID"]==null)return;
     if(Request.Params["ID"].Trim()=="")return;
     ViewState["ID"]=Request.Params["ID"].Trim();
     sql = "select * from info where id="+ViewState["ID"].ToString();
     IDataReader read = ado.ExecuteReader(sql);
     while(read.Read())
     {
      this.txtID.Text = read["ID"].ToString();
      this.txtCaption.Text = read["caption"].ToString();
      this.txtFatherID.Text = read["fatherid"].ToString();
      this.txtRemark.Text = read["remark"].ToString();
      this.txtURL.Text = read["url"].ToString();
      this.txtImg.Text = read["img"].ToString();
    
     }
     read.Close();

    }

    private void btnSave_Click(object sender, System.EventArgs e)
    {
     if(this.txtCaption.Text.Trim()=="")
     {
      Page.RegisterStartupScript("","<script>alert('节点名称不能为空!!!');</script>");
      return;
     }
     if(File1.Value.Trim()!="")
     {
      File1.PostedFile.SaveAs(Server.MapPath("..//DownLoad//"+Path.GetFileName(File1.Value)));
      ImgURL = "./DownLoad/"+Path.GetFileName(File1.Value);
      this.txtImg.Text = ImgURL;
     }
     else
     {
      ImgURL = txtImg.Text;
     }
     url = txtURL.Text;
     sql = "update info set caption='"+this.txtCaption.Text+"',fatherID="+this.txtFatherID.Text+",url='"+url+"',img='"+ImgURL+"',remark='"+this.txtRemark.Text+"' where id="+ViewState["ID"].ToString();
     ado.ExecuteNonQuery(sql);
     //Response.Write("<script>parent.Left.location.reload();</script>");
     Response.Write("<script>parent.Left.location.href='http://localhost/ViewIETM/Tree.aspx';</script>");
   
     Response.Redirect("..//ShowPage.aspx?ID="+txtID.Text);
    }
}

ShowPage.aspx.cs文件

private void Page_Load(object sender, System.EventArgs e)
    {
     if(this.IsPostBack)return;
     if(Request.Params["ID"]==null)return;
     if(Request.Params["ID"].Trim()=="")return;
     ViewState["ID"]=Request.Params["ID"].ToString();
     sql = "select * from info where id="+ViewState["ID"].ToString();
     IDataReader read = ado.ExecuteReader(sql);
     while(read.Read())
     {
      this.txtCaption.Text =read["caption"].ToString();
      this.txtRemark.Text = read["remark"].ToString();
      this.Image1.ImageUrl = read["img"].ToString();
     }
     read.Close();

    }

如果大家还没有明白,可以发邮件到:[email protected]

你可能感兴趣的:(JS树+Asp.Net=动态树Tree.aspx)