服务器维护网站维护数据维护系统安全配置
专业定制网站企业建站一条龙、软件定制开发、系统集成
稳定虚机备案一条龙，稳定快捷通道
服务理念诚信守诺客户至上专业精神专心贯注

Ajax实现无刷新树

作者：黑客防线网安Ajax教程基地来源：黑客防线网安Ajax教程基地浏览次数：0

黑客防线网安网讯：　　1.建立一个aspx页面　　html代码　　<html xmlns="http://www.w3.org/1999/xhtml" >　　<head id="Head1" runat="server">　　 <title>小山</title>　　 <link type="text/css" h...

　　1.建立一个aspx页面
　　html代码
　　<html xmlns="http://www.w3.org/1999/xhtml" >
　　<head id="Head1" runat="server">
　　    <title>小山</title>
　　    <link type="text/css" href="../../Styles/tree_css/tree.css" rel="stylesheet">
　　</head>
　　<body>
　　    <form id="Form1" runat="server">
　　    <table width=100% cellpadding=0 cellspacing=0 border=0>
　　        <colgroup>
　　            <col width=180 />
　　            <col />
　　        </colgroup>
　　        <tr>
　　            <td>
　　                <div class="TreeMenu" id="CategoryTree" style="width: 100%; height: 489px">
　　                </div>
　　            </td>
　　            <td>
　　                <iframe id=furl height=20 style="height: 497px; width: 100%;"></iframe>
　　            </td>
　　        </tr>
　　    </table>
　　
　　            <script language="jscript">
　　            function el(id)
　　            {
　　                return document.getElementById(id);
　　            }
　　            function ExpandSubCategory(iCategoryID)
　　            {
　　                var li_father = el("li_" + iCategoryID);
　　                if (li_father.getElementsByTagName("li").length > 0) //分类已下载
　　                {
　　                    ChangeStatus(iCategoryID);
　　                    return;
　　                }
　　
　　                li_father.className = "Opened";
　　
　　                switchNote(iCategoryID, true);
　　                AjaxMethod.GetSubCategory(iCategoryID, GetSubCategory_callback);
　　            }

　　            function GetSubCategory_callback(response)
　　            {
　　                var dt = response.value.Tables[0];
　　                if (dt.Rows.length > 0)
　　                {
　　                    var iCategoryID = dt.Rows[0].FatherID;
　　                }
　　                var li_father = el("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 = "../../Styles/tree_css/s.gif";
　　
　　                        var a = document.createElement("a");
　　                        var id = dt.Rows[i].CategoryID;
　　                        a.onmouseover = function()
　　                        {
　　                            PreviewImage(id);
　　                        };
　　                        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 = "../../Styles/tree_css/s.gif";
　　                        img.onclick = function () {
　　                            ExpandSubCategory(this.id);
　　                        };
　　                        img.alt = "展开/折叠";
　　
　　                        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);
　　
　　                switchNote(iCategoryID, false);
　　            }
　　
　　            // 叶子节点的单击响应函数
　　            function OpenDocument(iCategoryID)
　　            {
　　                // 预加载信息
　　                PreloadFormUrl(iCategoryID);
　　            }
　　
　　            function PreviewImage(iCategoryID)
　　            {
　　
　　            }

　　            // 加载根节点
　　            var tree = el("CategoryTree");
　　            var root = document.createElement("li");
　　            root.id = "li_0";
　　            tree.appendChild(root);
　　
　　            // 加载页面时显示第一级分类
　　            ExpandSubCategory(0);
　　
　　            function PreloadFormUrl(iCategoryID)
　　            {
　　                // 采用同步调用的方式获取图片的信息
　　                var ds = AjaxMethod.GetFormsList(iCategoryID).value;
　　                // 如果返回了结果
　　                if (ds)
　　                {
　　                    // 判断数据表是否不为空
　　                    if (ds.Tables[0].Rows.length > 0)
　　                    {
　　                        // 返回的信息数据表
　　                        dt = ds.Tables[0];
　　                        el("furl").src = dt.Rows[0].FormUrl;
　　                    }
　　                    else // 分类下没有
　　                    {
　　                    }
　　                }
　　            }
　　            </script>
　　    </form>
　　</body>
　　</html>2.cs代码
　　using System;
　　using System.Data;
　　using System.Configuration;
　　using System.Collections;
　　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;
　　using AjaxPro;

　　public partial class Pages_Home_HomePage : System.Web.UI.Page
　　{
　　    protected void Page_Load(object sender, EventArgs e)
　　    {
　　        Utility.RegisterTypeForAjax(typeof(AjaxMethod));
　　    }
　　}3.建立一个tree.css的css样式
　　a
　　{}{
　　    text-decoration:none;
　　}
　　a,a:visited
　　{}{
　　    color:#000;
　　    background:inherit;
　　}
　　body
　　{}{
　　    margin:0;
　　    padding:20px;
　　    font:12px tahoma,宋体,sans-serif;
　　}
　　dt
　　{}{
　　    font-size:22px;
　　    font-weight:bold;
　　    margin:0 0 0 15px;
　　}
　　dd
　　{}{
　　    margin:0 0 0 15px;
　　}
　　h4
　　{}{
　　    margin:0;
　　    padding:0;
　　    font-size:18px;
　　    text-align:center;
　　}
　　p
　　{}{
　　    margin:0;
　　    padding:0 0 0 18px;
　　}
　　p a,p a:visited
　　{}{
　　    color:#00f;
　　    background:inherit;
　　}

　　.TreeMenu img.s
　　{}{
　　    cursor:hand;
　　    vertical-align:middle;
　　}
　　.TreeMenu ul
　　{}{
　　    padding:0;
　　}
　　.TreeMenu li
　　{}{
　　    list-style:none;
　　    padding:0;
　　}
　　.Closed ul
　　{}{
　　    display:none;
　　}
　　.Child img.s
　　{}{
　　    background:none;
　　    cursor:default;
　　}

　　#CategoryTree ul
　　{}{
　　    margin:0 0 0 17px;
　　}
　　#CategoryTree img.s
　　{}{
　　    width:34px;
　　    height:18px;
　　}
　　#CategoryTree .Opened img.s
　　{}{
　　    background:url(skin3/opened.gif) no-repeat 0 1px;
　　}
　　#CategoryTree .Closed img.s
　　{}{
　　    background:url(skin3/closed.gif) no-repeat 0 1px;
　　}
　　#CategoryTree .Child img.s
　　{}{
　　    background:url(skin3/child.gif) no-repeat 13px 2px;
　　}

　　#CategoryTree
　　{}{
　　    float:left;
　　    width:249px;
　　    border:1px solid #99BEEF;
　　    background:#D2E4FC;
　　    color:inherit;
　　    margin:3px;
　　    padding:3px;
　　    height:600px;
　　}
　　4.建立一个类AjaxMethod
　　using System;
　　using System.Data;
　　using System.Data.SqlClient;
　　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;
　　using AjaxPro;

　　/**//// <summary>
　　/// Summary description for AjaxMethod
　　/// </summary>
　　public class AjaxMethod
　　{}{
　　    public AjaxMethod()
　　    {
　　        //
　　        // TODO: Add constructor logic here
　　        //
　　    }
　　    [AjaxMethod(HttpSessionStateRequirement.ReadWrite)]
　　    public static DataSet GetSubCategory(int iCategoryID)
　　    {}{
　　        string sql = string.Format("SELECT CategoryID, CategoryName, FatherID, dbo.IsLeaf(CategoryID) as IsChild FROM Category WHERE FatherID = {0}", iCategoryID);
　　        return GetDataSet(sql);
　　    }

　　    [AjaxMethod(HttpSessionStateRequirement.ReadWrite)]
　　    public static DataSet GetFormsList(int iCategoryID)
　　    {}{
　　        string sql = string.Format("SELECT * FROM forms WHERE form_category_id = {0}", iCategoryID);
　　        return GetDataSet(sql);
　　    }
　　public static string ConnectionString = ConfigurationSettings.AppSettings["ConnectionString"].ToString();

　　        public static DataSet GetDataSet(string sql)
　　        {}{
　　            SqlDataAdapter sda = new SqlDataAdapter(sql, ConnectionString);
　　            DataSet ds = new DataSet();
　　            sda.Fill(ds);
　　            if (ds != null)
　　                return ds;
　　            else
　　                return null;
　　        }
　　}5.sql脚本
　　if exists (select * from dbo.sysobjects where id = object_id(N'[dbo].[Category]') and OBJECTPROPERTY(id, N'IsUserTable') = 1)
　　drop table [dbo].[Category]
　　GO

　　if exists (select * from dbo.sysobjects where id = object_id(N'[dbo].[Forms]') and OBJECTPROPERTY(id, N'IsUserTable') = 1)
　　drop table [dbo].[Forms]
　　GO

　　CREATE TABLE [dbo].[Category] (
　　    [CategoryID] [int] IDENTITY (1, 1) NOT NULL ,
　　    [CategoryName] [varchar] (20) COLLATE Chinese_PRC_CI_AS NULL ,
　　    [FatherID] [int] NULL
　　) ON [PRIMARY]
　　GO

　　CREATE TABLE [dbo].[Forms] (
　　    [FormID] [int] IDENTITY (1, 1) NOT NULL ,
　　    [FormName] [nvarchar] (50) COLLATE Chinese_PRC_CI_AS NULL ,
　　    [FormUrl] [nvarchar] (50) COLLATE Chinese_PRC_CI_AS NULL ,
　　    [Form_category_id] [int] NULL ,
　　    [target] [char] (10) COLLATE Chinese_PRC_CI_AS NULL
　　) ON [PRIMARY]
　　GO
　　CREATE FUNCTION IsLeaf (@cat_id int)
　　RETURNS int AS
　　BEGIN

　　declare @count int
　　select @count = (select count(*) from Category where FatherID=@cat_id)
　　if (@count=0)
　　return 1
　　return 0

　　END

黑客防线网安服务器维护方案本篇连接：http://www.rongsen.com.cn/show-15509-1.html

网站维护教程更新时间:2012-04-05 00:02:25 【打印此页】【关闭】