： ajax和c#.net相结合的树型菜单

此代码是从网上下载的资源，后经过修改
在此感谢原著作者

----------------------------web.config----------
<httpHandlers>
<add verb="POST,GET" path="ajaxpro/*.ashx" type="AjaxPro.AjaxHandlerFactory, AjaxPro" />
</httpHandlers>
--------------------------Tree.aspx

<% @ Page Language = " C# " AutoEventWireup = " true " CodeFile = " Tree.aspx.cs " Inherits = " _Default " %>

<! DOCTYPE html PUBLIC " -//W3C//DTD XHTML 1.0 Transitional//EN " " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd " >

< html xmlns = " http://www.w3.org/1999/xhtml " >
< head runat = " server " >
< title > Ajax Efficient Tree </ title >
< link type = " text/css " href = " css/tree.css " rel = " stylesheet " >
</ head >
< body >
< form id = " form1 " runat = " server " >
< div >
< asp:Panel ID = " Panel1 " runat = " server " Height = " 300px " Width = " 100px " >
< div id = " CategoryTree " class = " TreeMenu " style = " width: 150px " ></ div >
</ asp:Panel >
< script language = " jscript " >
var tree = document.getElementById( " CategoryTree " ); // 获取上面那个div的id名称
var root = document.createElement( " li " );
root.id = " li_0 " ;
tree.appendChild( root );
ExpandSubCategory( 0 );
function ExpandSubCategory( categoryID )
... {
var liFather = document.getElementById( "li_" + categoryID );
if( liFather.getElementsByTagName("li").length > 0)
...{
ChangeStatus( categoryID );
return;
}
liFather.className = "Opened";
SwitchNode( categoryID, true );

//仅获取当前节点的子Nodes
_Default.GetSubCategory( categoryID, GetSubCategory_callback );
}
function SwitchNode( CategoryID, show )
... {
var li_father = document.getElementById("li_" + CategoryID);
if( show )
...{
var ul = document.createElement("ul");
ul.id = "ul_note_" + CategoryID;

var note = document.createElement("li");
note.className = "Child";

var img = document.createElement("img");
img.className = "s";
img.src = "css/s.gif";

var a = document.createElement("a");
a.href = "javascript:void(0);";
a.innerHTML = "Please waiting...";

note.appendChild(img);
note.appendChild(a);
ul.appendChild(note);
li_father.appendChild(ul);
}
else
...{
var ul = document.getElementById("ul_note_" + CategoryID );
if( ul )
...{
li_father.removeChild(ul);
}
}
}
function GetSubCategory_callback( response )
... {
var dt = response.value.Tables[0];
if( dt.Rows.length > 0 )
...{
var iCategoryID = dt.Rows[0].FatherID;
}
var li_father = document.getElementById("li_" + iCategoryID );
var ul = document.createElement("ul");
for( var i = 0; i < dt.Rows.length; i++ )
...{
if( dt.Rows[i].IsChild == 1 )
...{
var li = document.createElement("li");
li.className = "Child";
li.id = "li_" + dt.Rows[i].CategoryID;
var img = document.createElement("img");
img.id = dt.Rows[i].CategoryID;
img.className = "s";
img.src = "css/s.gif";
var a = document.createElement("a");
a.href = "javascript:OpenDocument('" + dt.Rows[i].CategoryID + "');";
a.innerHTML = dt.Rows[i].CategoryName;
}
else
...{
var li = document.createElement("li");
li.className = "Closed";
li.id = "li_" + dt.Rows[i].CategoryID;
var img = document.createElement("img");
img.id = dt.Rows[i].CategoryID;
img.className = "s";
img.src = "css/s.gif";
img.onclick = function()...{ ExpandSubCategory( this.id ); };
img.alt = "Expand/collapse";
var a = document.createElement("a");
a.href = "javascript:ExpandSubCategory('" + dt.Rows[i].CategoryID + "');";
a.innerHTML = dt.Rows[i].CategoryName;
}
li.appendChild(img);
li.appendChild(a);
ul.appendChild(li);
}
li_father.appendChild(ul);
SwitchNode( iCategoryID, false );
}

// 单击叶节点时, 异步从服务端获取单个节点的数据.
function OpenDocument( CategoryID )
... {
_Default.GetNameByCategoryID( CategoryID, GetNameByCategoryID_callback );
}

function GetNameByCategoryID_callback( response )
... {
//alert( response.value );
//location.href="http://www.sohu.com";此处作了修改， 能跳转到frameset的主页面
if(response.value=="修改密码")
window.open("http://www.sohu.com","main");
else if(response.value=="钢笔")
window.open("http://www.baidu.com","main");
}

function ChangeStatus( CategoryID )
... {
var li_father = document.getElementById("li_" + CategoryID );
if( li_father.className == "Closed" )
...{
li_father.className = "Opened";
}
else
...{
li_father.className = "Closed";
}
}
</ script >
</ div >
</ form >
</ body >
</ html >

--------------------Tree.aspx.cs------------

using System;
using System.Data;
using System.Configuration;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;

public partial class _Default : System.Web.UI.Page
... {
//此对象用于存放所有的节点数
public static DataSet dsAllNodes = new DataSet();

protected void Page_Load(object sender, EventArgs e)
...{
AjaxPro.Utility.RegisterTypeForAjax(typeof(_Default));
CreateNodes();
}

private DataTable CreateStructure()
...{
DataTable dt = new DataTable();
dt.Columns.Ad

 

评论 (0) 引用 (0) 一般分类[15]