梅花雪2.0javascript树数据库绑定示例，[asp.net基础]

2023-09-26 19:50:40

梅花雪的js树，运行速度快，简单易用。2.0版本树与sqlserver数据库数据绑定，IDE是VS2010，数据库是sql server2008。

图示：

mztree.aspx：

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

<html>
<head runat="server">
    <title>bubufx,tech.bubufx.com,布布分享</title>
    <script src="treescripts/jsframework.js" type="text/javascript"></script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <table width="500" border="0" cellspacing="0" cellpadding="0">
            <tr>
                <td width="50">
                    &nbsp;
                </td>
                <td>
                    <div style="width: 300px; height: 500px; overflow: auto;">
                        <script language="JavaScript" type="text/javascript">
                        var data = {};
                        <%=treeone %>

                        var xmlstr = "<%=tree %>";

                        //*
                        Using("System.Web.UI.WebControls.MzTreeView");
                        var a = new MzTreeView();
                        a.dataSource = data
                        a.loadXmlDataString(xmlstr, ’0’);

                        a.autoSort = false;
                        a.useCheckbox = false
                        a.canOperate = true;
                        document.write(a.render());
                        a.expandLevel(6);
                        //*/

                        </script>
                    </div>
                </td>
                <td width="50">
                    &nbsp;
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

mztree.aspx.cs：

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

using System.Data;

public partial class mztree : System.Web.UI.Page
{

    public string tree = "";
    public string treeone = "";

    protected void Page_Load(object sender, EventArgs e)
    {

        if (!Page.IsPostBack)
        {
            string sql = "";
            string connstr = System.Configuration.ConfigurationManager.AppSettings["DataSQL"];

            DB cDB = new DB();

            sql = "select * from mztree";

            DataTable DT = cDB.RunSQLGetDT(sql, connstr);

            if (DT.Rows.Count > 0)
            {

                tree = tree + "<nodes>";

                treeone = "data[’-1_0’] = ’text: 梅花雪树;’;";

                nodeBinding(DT, "0");

                tree = tree + "</nodes>";
            }
        }

    }

    
    public void nodeBinding(DataTable _dt, string _filter)
    {
        string sFilter = "pid=" + _filter;

        DataView dv = new DataView(_dt);

        dv.RowFilter = sFilter;

        if (dv.Count > 0)
        {
            foreach (DataRowView drv in dv)
            {
                tree = tree + "<node id=’" + drv["ID"].ToString() + "’ text=’" + drv["name"].ToString() + "’ url=’testurl.aspx?id=" + drv["ID"].ToString() + "’ target=’_blank’>";

                nodeBinding(_dt, drv["ID"].ToString());                

                tree = tree + "</node>";
            }
        }
    }

}

数据库表结构：

CREATE TABLE [mzTree](
	[ID] [int] IDENTITY(1,1) NOT NULL,
	[name] [nvarchar](50) NULL,
	[pid] [int] NULL
)

梅花雪2.0javascript树数据库绑定示例，[asp.net基础]

码农公寓

相关文章