ASP.NET AJAX 无限级 JS 树形菜单

最新推荐文章于 2021-11-15 15:12:08 发布
原创 最新推荐文章于 2021-11-15 15:12:08 发布 · 1.2k 阅读 · 2 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#asp.net #ajax #json #dataset #list #menu

本文介绍了一个使用JQuery AJAX从服务器获取JSON数据并将其格式化为动态树形菜单的过程。涉及了前后端交互、JSON数据处理及JSTree的构建。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

功能说明：

        由Tree.html中的JQuery AJAX代码发起HTTP请求到GetTreeData.aspx获取JSON格式的字符串，然后在Tree.html中将字符串格式化为JSON格式，用dTree函数递归构造JS Tree。

步骤：

       1）创建Menu类（为了构造List<T>泛型集合）

       2）创建FormatToJson类

       3）创建GetTreeData.aspx窗体，添加后台实现代码

       4）创建Tree.html，并处理数据递归绑定Tree 

 1、Tree.html

<!--Tree.html-->
<!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>
    <title></title>
    <script type="text/javascript" src="Scripts/dtree.js"></script>
    <script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
    <script type="text/javascript">
        d = new dTree('d');
        d.add(0, -1, '模块列表');
        function getData(id) {
            $.ajax({
                url: 'TreeSource/GetTreeData.aspx?parentID=' + id,
                type: 'post',
                datatype: 'json',
                success: function (returnJsonValue) {
                    if (returnJsonValue.length > 0) {
                        //格式化为JSON数据格式
                        var json = eval("(" + returnJsonValue + ")");
                        //document.write(json.Menu[0].MenuName);
                        //遍历集合，添加树节点
                        $.each(json.Menu, function (key, value) {
                            if (id == 0) {
                                d.add(value.ID, value.ParentMenuID, value.MenuName, value.MenuClickURL, value.MenuName, 'mainFrame', 'images/Tree/folder.gif', 'images/Tree/folderopen.gif');
                            }
                            else {
                                d.add(value.ID, value.ParentMenuID, value.MenuName, value.MenuClickURL, value.MenuName, 'mainFrame');
                            }
                            //根据模块的ParentID递归绑定数据
                            getData(value.ID);
                        })
                    }
                    else {
                        $("#divTree").html(d.toString());
                        //数据请求完毕，隐藏图片
                        $("#imgLoading").hide();
                    }
                }
            })
        }
        $(getData(0));
    </script>  
    <style type="text/css">
        img
        {
            border:0px;
        }
    </style>
</head>
<body>
    <!--数据请求完成之前显示-->
    <img id="imgLoading" src="Images/Loading/loading01.gif" alt="正在加载..." />
    <!--显示树形列表-->
    <div id="divTree">
    </div>
</body>
</html>

 

2、请求数据的ASP.NET网页后台代码（前台清空就剩Page命令那一行就可以了）

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using DAO;
using System.Data;
using System.Text;
using System.Reflection;

public partial class TreeSource_GetTreeData : System.Web.UI.Page
{
    SqlHelper helper = new SqlHelper();
    protected void Page_Load(object sender, EventArgs e)
    {
        if (!IsPostBack)
        {
            this.GetMenuByParentID();
        }
    }

    private void GetMenuByParentID()
    {
        if (ParentID != null)
        {
            DataTable dt = helper.FillDataTable(String.Format(
                "SELECT * FROM SunZonTMSMenu WHERE ParentMenuID={0} AND IsOpen=1", ParentID.ToString()
                ));
            IList<Menu> menu = new List<Menu>();
            if (dt != null && dt.Rows.Count > 0)
            {
                foreach (DataRow dr in dt.Rows)
                {
                    menu.Add(new Menu() { 
                    ID=Int32.Parse(dr["ID"].ToString()),
                    ParentMenuID = Int32.Parse(dr["ParentMenuID"].ToString()),
                    MenuName = dr["MenuName"].ToString(),
                    MenuCode = dr["MenuCode"].ToString(),
                    MenuClickURL = dr["MenuClickURL"].ToString()
                    });
                }
            }

            if (menu.Count > 0)
            {
                Response.Write(FormatToJson.ListToJson<Menu>(menu));
            }
        }
 
    }
    
    //上级Menu的ID
    private Int32? ParentID
    {
        get
        {
            try
            {
                return Int32.Parse(Request.QueryString["parentID"]);
            }
            catch
            {
                return null;
            }
        }
    }
}

 

3、使用到的Menu实体类

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;

/// <summary>
/// Summary description for Menu
/// </summary>
public class Menu
{
    public Menu()
    {
        //
        // TODO: Add constructor logic here
        //
    }

    public int ID { get; set; }

    public int ParentMenuID { get; set; }

    public string MenuName { get; set; }

    public string MenuCode { get; set; }

    public string MenuClickURL { get; set; }

}

 

 4、使用的构造JSON数据格式的类（此类不是本人写的，来源于互联网）

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Text;
using System.Reflection;
using System.Collections;
using System.Data;
using System.Data.Common;

/// <summary>
/// Summary description for FormatToJson
/// </summary>
public class FormatToJson
{
    public FormatToJson()
    {
        //
        // TODO: Add constructor logic here
        //
    }
    /// <summary>  
    /// List转成json   
    /// </summary>  
    /// <typeparam name="T"></typeparam>  
    /// <param name="jsonName"></param>  
    /// <param name="list"></param>  
    /// <returns></returns>  
    public static string ListToJson<T>(IList<T> list, string jsonName)
    {
        StringBuilder Json = new StringBuilder();
        if (string.IsNullOrEmpty(jsonName))
            jsonName = list[0].GetType().Name;
        Json.Append("{/"" + jsonName + "/":[");
        if (list.Count > 0)
        {
            for (int i = 0; i < list.Count; i++)
            {
                T obj = Activator.CreateInstance<T>();
                PropertyInfo[] pi = obj.GetType().GetProperties();
                Json.Append("{");
                for (int j = 0; j < pi.Length; j++)
                {
                    Type type = pi[j].GetValue(list[i], null).GetType();
                    Json.Append("/"" + pi[j].Name.ToString() + "/":" + StringFormat(pi[j].GetValue(list[i], null).ToString(), type));

                    if (j < pi.Length - 1)
                    {
                        Json.Append(",");
                    }
                }
                Json.Append("}");
                if (i < list.Count - 1)
                {
                    Json.Append(",");
                }
            }
        }
        Json.Append("]}");
        return Json.ToString();
    }

    /// <summary>  
    /// List转成json   
    /// </summary>  
    /// <typeparam name="T"></typeparam>  
    /// <param name="list"></param>  
    /// <returns></returns>  
    public static string ListToJson<T>(IList<T> list)
    {
        object obj = list[0];
        return ListToJson<T>(list, obj.GetType().Name);
    }

    /// <summary>   
    /// 对象转换为Json字符串   
    /// </summary>   
    /// <param name="jsonObject">对象</param>   
    /// <returns>Json字符串</returns>   
    public static string ToJson(object jsonObject)
    {
        string jsonString = "{";
        PropertyInfo[] propertyInfo = jsonObject.GetType().GetProperties();
        for (int i = 0; i < propertyInfo.Length; i++)
        {
            object objectValue = propertyInfo[i].GetGetMethod().Invoke(jsonObject, null);
            string value = string.Empty;
            if (objectValue is DateTime || objectValue is Guid || objectValue is TimeSpan)
            {
                value = "'" + objectValue.ToString() + "'";
            }
            else if (objectValue is string)
            {
                value = "'" + ToJson(objectValue.ToString()) + "'";
            }
            else if (objectValue is IEnumerable)
            {
                value = ToJson((IEnumerable)objectValue);
            }
            else
            {
                value = ToJson(objectValue.ToString());
            }
            jsonString += "/"" + ToJson(propertyInfo[i].Name) + "/":" + value + ",";
        }
        jsonString.Remove(jsonString.Length - 1, jsonString.Length);
        return jsonString + "}";
    }

    /// <summary>   
    /// 对象集合转换Json   
    /// </summary>   
    /// <param name="array">集合对象</param>   
    /// <returns>Json字符串</returns>   
    public static string ToJson(IEnumerable array)
    {
        string jsonString = "[";
        foreach (object item in array)
        {
            jsonString += ToJson(item) + ",";
        }
        jsonString.Remove(jsonString.Length - 1, jsonString.Length);
        return jsonString + "]";
    }

    /// <summary>   
    /// 普通集合转换Json   
    /// </summary>   
    /// <param name="array">集合对象</param>   
    /// <returns>Json字符串</returns>   
    public static string ToArrayString(IEnumerable array)
    {
        string jsonString = "[";
        foreach (object item in array)
        {
            jsonString = ToJson(item.ToString()) + ",";
        }
        jsonString.Remove(jsonString.Length - 1, jsonString.Length);
        return jsonString + "]";
    }

    /// <summary>   
    /// Datatable转换为Json   
    /// </summary>   
    /// <param name="table">Datatable对象</param>   
    /// <returns>Json字符串</returns>   
    public static string ToJson(DataTable dt)
    {
        StringBuilder jsonString = new StringBuilder();
        jsonString.Append("[");
        DataRowCollection drc = dt.Rows;
        for (int i = 0; i < drc.Count; i++)
        {
            jsonString.Append("{");
            for (int j = 0; j < dt.Columns.Count; j++)
            {
                string strKey = dt.Columns[j].ColumnName;
                string strValue = drc[i][j].ToString();
                Type type = dt.Columns[j].DataType;
                jsonString.Append("/"" + strKey + "/":");
                strValue = StringFormat(strValue, type);
                if (j < dt.Columns.Count - 1)
                {
                    jsonString.Append(strValue + ",");
                }
                else
                {
                    jsonString.Append(strValue);
                }
            }
            jsonString.Append("},");
        }
        jsonString.Remove(jsonString.Length - 1, 1);
        jsonString.Append("]");
        return jsonString.ToString();
    }

    /// <summary>  
    /// DataTable转成Json   
    /// </summary>  
    /// <param name="jsonName"></param>  
    /// <param name="dt"></param>  
    /// <returns></returns>  
    public static string ToJson(DataTable dt, string jsonName)
    {
        StringBuilder Json = new StringBuilder();
        if (string.IsNullOrEmpty(jsonName))
            jsonName = dt.TableName;
        Json.Append("{/"" + jsonName + "/":[");
        if (dt.Rows.Count > 0)
        {
            for (int i = 0; i < dt.Rows.Count; i++)
            {
                Json.Append("{");
                for (int j = 0; j < dt.Columns.Count; j++)
                {
                    Type type = dt.Rows[i][j].GetType();
                    Json.Append("/"" + dt.Columns[j].ColumnName.ToString() + "/":" + StringFormat(dt.Rows[i][j].ToString(), type));
                    if (j < dt.Columns.Count - 1)
                    {
                        Json.Append(",");
                    }
                }
                Json.Append("}");
                if (i < dt.Rows.Count - 1)
                {
                    Json.Append(",");
                }
            }
        }
        Json.Append("]}");
        return Json.ToString();
    }

    /// <summary>   
    /// DataReader转换为Json   
    /// </summary>   
    /// <param name="dataReader">DataReader对象</param>   
    /// <returns>Json字符串</returns>   
    public static string ToJson(DbDataReader dataReader)
    {
        StringBuilder jsonString = new StringBuilder();
        jsonString.Append("[");
        while (dataReader.Read())
        {
            jsonString.Append("{");
            for (int i = 0; i < dataReader.FieldCount; i++)
            {
                Type type = dataReader.GetFieldType(i);
                string strKey = dataReader.GetName(i);
                string strValue = dataReader[i].ToString();
                jsonString.Append("/"" + strKey + "/":");
                strValue = StringFormat(strValue, type);
                if (i < dataReader.FieldCount - 1)
                {
                    jsonString.Append(strValue + ",");
                }
                else
                {
                    jsonString.Append(strValue);
                }
            }
            jsonString.Append("},");
        }
        dataReader.Close();
        jsonString.Remove(jsonString.Length - 1, 1);
        jsonString.Append("]");
        return jsonString.ToString();
    }

    /// <summary>   
    /// DataSet转换为Json   
    /// </summary>   
    /// <param name="dataSet">DataSet对象</param>   
    /// <returns>Json字符串</returns>   
    public static string ToJson(DataSet dataSet)
    {
        string jsonString = "{";
        foreach (DataTable table in dataSet.Tables)
        {
            jsonString += "/"" + table.TableName + "/":" + ToJson(table) + ",";
        }
        jsonString = jsonString.TrimEnd(',');
        return jsonString + "}";
    }

    /// <summary>  
    /// 过滤特殊字符  
    /// </summary>  
    /// <param name="s"></param>  
    /// <returns></returns>  
    private static string String2Json(String s)
    {
        StringBuilder sb = new StringBuilder();
        for (int i = 0; i < s.Length; i++)
        {
            char c = s.ToCharArray()[i];
            switch (c)
            {
                case '/"':
                    sb.Append("///""); break;
                case '//':
                    sb.Append("////"); break;
                case '/':
                    sb.Append("///"); break;
                case '/b':
                    sb.Append("//b"); break;
                case '/f':
                    sb.Append("//f"); break;
                case '/n':
                    sb.Append("//n"); break;
                case '/r':
                    sb.Append("//r"); break;
                case '/t':
                    sb.Append("//t"); break;
                default:
                    sb.Append(c); break;
            }
        }
        return sb.ToString();
    }

    /// <summary>  
    /// 格式化字符型、日期型、布尔型  
    /// </summary>  
    /// <param name="str"></param>  
    /// <param name="type"></param>  
    /// <returns></returns>  
    private static string StringFormat(string str, Type type)
    {
        if (type == typeof(string))
        {
            str = String2Json(str);
            str = "/"" + str + "/"";
        }
        else if (type == typeof(DateTime))
        {
            str = "/"" + str + "/"";
        }
        else if (type == typeof(bool))
        {
            str = str.ToLower();
        }
        return str;
    }
}
ASP.NET树形菜单Tree数据库版
06-01
ASP.NET树形菜单Tree数据库版! 值得下载看看!资源免费,大家分享!! 更多免费资源 http://ynsky.download.csdn.net/
asp.net 经典树形菜单
10-09
很不错的asp.net树形菜单, 大家可以看看。
asp.net2.0利用TreeView实现无限级树型菜单
xhlinlinxh的专栏
07-22 1803
闲话不说，下面开始：第一步：创建一个asp.net工程，命名为TreeViewTest(自己喜欢吧，叫什么都可以)。第二步：在工程中添加一个XML文件，命名为TreeSource.xml；将Default.aspx切换到设计视图，拽进一个TreeView控件命名为TreeView1和一个XmlDataSource控件命名为XmlDataSource1，配置TreeView1的数据源为Xml
基于ajax的一个无限树型菜单【原创】
weixin_30549175的博客
05-18 137
　　最近又用到了树型菜单，原来做的是一次把数据都读出来，现在想想，感觉就是不爽，要是每次按需要读就ok了，正好可以用ajax。　　首先是ajax的处理，写个js吧，用oo写，ajax.js内容如下： /***@authorzxub2006-06-01*状态信息显示类，用varStatus=newfunction()定义，可以静态引用其中的方法*一般情况下为functionS...
ASP.NET源码——无限级树形菜单(Sql数据库).zip
10-10
在这个"ASP.NET源码——无限级树形菜单(Sql数据库)"项目中，开发者构建了一个利用 ASP.NET 技术实现的无限级树形菜单，其数据存储在 SQL 数据库中。这通常是为了实现网站导航、组织结构或者分类目录等功能。 首先，...
ASP.NET实现无限级树形菜单的JQuery开发教程
通过上述的描述和标签，我们可以了解到，这本关于ASP.NET和jQuery开发书型菜单的书籍或教程，将涵盖ASP.NET的基础知识、jQuery库的使用、无限级树形菜单的开发以及可能包含的书型菜单设计。开发者在掌握这些知识点后...
ASP.NET版仿Windows AJAX无限级树形菜单实现
Ajax无限级树形菜单是一种网页交互式组件，能够模拟现实中的树状结构，如文件夹结构，用于展示具有层级关系的数据。在本例中，我们讨论的是基于ASP.NET平台开发的无限级树形菜单，其使用C#作为后端开发语言，采用...
asp.net树形结构菜单demo/无限级分类/zTree
09-05
jquery的一个插件zTree.此demo是用vs08+sql2005写的 可任意修改 像样更多的功能和外观 就去zTree官网下一个 我写的这个是动态的 就是说是连接数据库的 class表 必须的字段 ID 父ID 还有类别名称。 不懂的可以随时问我
asp.net 树形菜单 增删改查 示例
03-15
asp.net 树形菜单 增删改查 示例
ASP.NET TreeView树型菜单操作实例
04-06
要求用asp.net实现一个树形机构，根节点为 福建省，展开+号后为福州市、泉州市、宁德市等9个地市，再展开+号福州市，则现实台江区、鼓楼区等节点。点击节点的名称弹出提示框，提示框的内容为：“你当前选择的节点名称为：XXX”--其中XXX为当前选中节点的名称。 根据以上要求设计一个数据库表，节点名称可根据数据库中的内容动态显示。
节点互斥的ASP.NET TreeView动态树形菜单.rar
07-10
节点互斥的ASP.NET TreeView动态树形菜单，N年前写的了，扔了这么多年重新扒出来了，当时在VS2003下测试通过 　　1。工具箱-->添加/移除项-->选.NET组件--浏览--打开--确定 　　2。把Microsoft.Web.UI.WebControls.dll复制到BIN文件夹中，添加引用 　　3。由工具箱拖放TREEVIEW控件 　　4.前台ShowPlus="False" ShowLines="False"控件显示格式 　　5.JS脚本控制节点互斥
ASP.NET树型菜单生成实例.rar
07-10
作者：刘旭 康厚文,功能：树型菜单,var strHTML=""; //定义生成的HTML树.测试环境，ASP.NET 3.0，在网页上实现 树形结构的折叠、展开风格菜单。
asp.net实现树形下拉列表
03-28
NULL 博文链接：https://alecrichard009.iteye.com/blog/1264763
[ASP.NET] jquery easyui实现树形菜单
XYZ
06-24 1555
效果预览：由于jquery的树形菜单需要使用特定格式的json数据，才能显示出来如上图的效果，因此需要我们在后台处理并拼接json字符串。笔者通过构造一棵树的数据类型，然后将节点信息保存到树中的各个节点实现的，过程如下所示：public class Tree&lt;T&gt; { public Tree() { nodes = new...
ASP.NET 树形菜单目录设计
weixin_30724853的博客
09-17 621
目录结构存储在数据库中，表结构如下： id 节点id号 name 节点名称 parentid 节点的父节点id号 navigateurl 节点指向的url地址 代码如下： 设计一个 MenuTree类 1.添加System.Web.UI.WebControls的引用 public class MenuTree { private Tree...
JS树+Asp.Net=动态树Tree.aspx
冷月宫主的专栏
11-05 1531
    Tree                http://schemas.microsoft.com/intellisense/ie5" name="vs_targetSchema">    .Node { }.Node span { font-size:12px; font-family:Verdana; cursor:default; margin-left:3px; height:17
.NET 树形菜单的实现
o_circle的博客
11-15 1016
.NET 树形菜单的实现 分为 h5的代码 js的代码 和后台代码 h5的代码内容 要把 树形菜单“画”出来 <div class="ibox-content"> <div class="row" id="listmain1"> <div class="form-group col-sm-12">
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

stoneson

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值