MSDN CSDN 导航树效果用ASP.Net(C#) + JavaScript 怎么实现？？

实际还是传统 CGI、ASP 的思想,没有使用Codebehind="WebFORM1.aspx.cs",仍然采取了 B/S 混合(HTML/C#)脚本的方式:<%@ Page language="c#" Codebehind="WebFORM1.aspx.cs" AutoEventWireup="false" Inherits="WebApplication5.WebFORM1" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebFORM1</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio 7.0">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="javascript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<FORM id="FORM1" method="post" runat="server">
</FORM>
<FONT face="宋体"></FONT><iframe width="100%" height="100" id="hiddenframe"></iframe>
<script>
function ExpandNode(ParentNode,ParentId){
var NodeX = eval(ParentNode.id + '_0');
if (NodeX.style.display == 'none')
  {
   NodeX.style.display="block";
   if (NodeX.loaded == 'no')
      {
       document.frames['hiddenframe'].location.replace("http://localhost/webservice/WebApplication5/WebFORM2.aspx?PID=" + ParentId + "&PNode=" + ParentNode.id);
       NodeX.loaded = 'yes';
     }
  }
else
  {
   NodeX.style.display='none';
  }
}
</script>
<CENTER>
<TABLE border="1" width="20%" height="60%">
<TR>
<TD>
<DIV style="OVERFLOW: auto;WIDTH: 100%;HEIGHT: 100%">
<TABLE width="300%"> <TR>
<TD>
<%
System.Data.OleDb.OleDbConnection oleDbConnection1 = new System.Data.OleDb.OleDbConnection();
oleDbConnection1.ConnectionString =@"Provider=SQLOLEDB.1;Persist Security Info=False;User ID=sa;Initial Catalog=Test;Data Source=TRIATON\PSQL2KE";
oleDbConnection1.ConnectionString =@"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("/dvbbs") + @"\Tree.mdb;Persist Security Info=False";
oleDbConnection1.Open();
System.Data.OleDb.OleDbCommand OleDbCommand1 = new System.Data.OleDb.OleDbCommand("select *,(select count(*) from tree where parentid = T.id) as children from tree T where rootid = id",oleDbConnection1) ;
System.Data.OleDb.OleDbDataReader OleDbDataReader1 = OleDbCommand1.ExecuteReader();
int i = 0;
while (OleDbDataReader1.Read())
{
%><div id='Node_<% = i %>'><a href='#'

<%if (System.Convert.ToInt64(OleDbDataReader1["children"])>0) {%>
      onClick='ExpandNode(Node_<% = i %>,<% =OleDbDataReader1["id"] %>)'>+</a>
             <%;}
             else {%>
                 >-</a><% ;}%>
                <a href='#'
            <%if (System.Convert.ToInt64(OleDbDataReader1["children"])>0)
                 {%>
                     onDblClick='ExpandNode(Node_<% = i %>,<% =OleDbDataReader1["children"]%>)'
                 <%}  %>
                 >
                 <% =OleDbDataReader1["children"]%></a>
</div>
<div id='Node_<% = i %>_0' style='display: none' loaded='no'>
       正在加载 ...
    </div>
          <%
i++;
} %>
</TD>
</TD>
</TR>
</TABLE>
</DIV></TD></TR></TABLE>
</CENTER>
</body>
</HTML>
<%@ Page language="c#" Codebehind="WebFORM2.aspx.cs" AutoEventWireup="false" Inherits="WebApplication5.WebFORM2" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>WebFORM2</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio 7.0">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="javascript">
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
</HEAD>
<body MS_POSITIONING="GridLayout">
<FORM id="WebFORM2" method="post" runat="server">
<FONT face="宋体"></FONT>
</FORM>
<%
string ParentNode;
ParentNode = Request.QueryString["pnode"];
//Response.Write(ParentNode.Replace("_",""));
int i;
int j;
string nSpace="";
j= ParentNode.Length - ParentNode.Replace("_","").Length;
for (i=0;i<j;i++)
    nSpace = nSpace + "    ";
string sHTML ="";
i=0;
       System.Data.OleDb.OleDbConnection oleDbConnection1 = new System.Data.OleDb.OleDbConnection();
oleDbConnection1.ConnectionString =@"Provider=SQLOLEDB.1;Persist Security Info=False;User ID=sa;Initial Catalog=Test;Data Source=TRIATON\PSQL2KE";
oleDbConnection1.ConnectionString =@"Provider=Microsoft.Jet.OLEDB.4.0;Data Source=" + Server.MapPath("/dvbbs") + @"\Tree.mdb;Persist Security Info=False";
oleDbConnection1.Open();
System.Data.OleDb.OleDbCommand OleDbCommand1 = new System.Data.OleDb.OleDbCommand("select *,(select count(*) from tree where parentid =T.id ) as Children from tree T where parentid = " + Request.QueryString["PID"],oleDbConnection1) ;
System.Data.OleDb.OleDbDataReader OleDbDataReader1 = OleDbCommand1.ExecuteReader();
while (OleDbDataReader1.Read())
{
    sHTML = sHTML + "<div id='" + ParentNode + "_" + (i + 1).ToString() + "'>" + nSpace + "<a href='#'";
    if (System.Convert.ToInt64(OleDbDataReader1["children"])>0)
               sHTML = sHTML + " onClick='ExpandNode(" + ParentNode + "_" + (i + 1).ToString() + "," + OleDbDataReader1["id"] + ")'>+";
            else
               sHTML = sHTML + ">-";
            sHTML = sHTML + "</a>\\n" + "<a href='#'";
           if (System.Convert.ToInt64(OleDbDataReader1["children"])>0)
              sHTML = sHTML + " onDblClick='ExpandNode(" + ParentNode + "_" + (i + 1).ToString() + "," + OleDbDataReader1["id"] + ")'";
           sHTML = sHTML + ">" + OleDbDataReader1["id"] + ": " + OleDbDataReader1["re"] + "</a></div>";
           if (System.Convert.ToInt64(OleDbDataReader1["children"])>0)
              sHTML = sHTML + "<div id='" + ParentNode + "_" + (i + 1).ToString() + "_0' style='display: none' loaded='no'>" + nSpace + "  正在加载 ...</div>";
            i++;
}
Response.Write(sHTML);
%>
<script>
    var x = eval('parent.' + '<% =Request.QueryString["pnode"] + "_0"%>' ) ;
    x.innerHTML="<% =sHTML %>";
</script>
</body>
</HTML>

调试易

MSDN CSDN 导航树效果用ASP.Net(C#) + JavaScript 怎么实现？？

解决方案 »