首页 > 解决方案 > 如何使用 c# 在 javascript 中显示来自特定父级的完整树

问题描述

我们正在尝试从数据库中显示 HierarchyTrees,而没有任何条件显示它很好。

但是当我们为特定用户应用条件时,只显示 root 的三个孩子而不显示孩子的子孩子。

我通过使用 InputBox 创建了一个 InputBox,我通过条件传递了 Parent Id,但它只显示了三个孩子没有显示完整的树。

这是前端代码

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">

     <div id="chart">
</div>
    <input type="text" id="txtSearch" runat="server" value="t" clientidmode="Static" />

</asp:Content> 

这是 Javascript 代码

 <script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">

    google.load("visualization", "1", { packages: ["orgchart"] });
    google.setOnLoadCallback(drawChart);
    function drawChart() {
        $.ajax({
            type: "POST",
            url: "WebForm21.aspx/GetChartData",

            data: "{'username':'" + document.getElementById('txtSearch').value + "'}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (r) {
                var data = new google.visualization.DataTable();
                data.addColumn('string', 'Entity');
                data.addColumn('string', 'ParentEntity');
                data.addColumn('string', 'ToolTip');
                for (var i = 0; i < r.d.length; i++) {
                    var memberId = r.d[i][0].toString();
                    var memberName = r.d[i][1];
                    var sp = r.d[i][3];
                    var parentId = r.d[i][2].toString() ? r.d[i][2].toString() : '';
                    data.addRows([[{
                        v: sp,
                        f: memberName + '<div><img src = "Pictures/' + memberId + '.jpg" /></div>'
                    }, parentId, memberName]]);
                }
                var chart = new google.visualization.OrgChart($("#chart")[0]);
                chart.draw(data, { allowHtml: true });
            },
            failure: function (r) {
                alert(r.d);
            },
            error: function (r) {
                alert(r.d);
            }
        });
    }
</script>

这是后端代码

[WebMethod]
        public static List<object> GetChartData(string username)
        {

            string query = "SELECT RegionLoginOID, RegionName, SponserID,Child_Id";
            query += " FROM RegionLogin where SponserID LIKE ''+@SponserID+'%' ";
            
            using (SqlConnection con = ClsConnection.Connections())
            {
                using (SqlCommand cmd = new SqlCommand(query))
                {
                    cmd.Parameters.AddWithValue("@SponserID", username);
                    List<object> chartData = new List<object>();
                    cmd.CommandType = CommandType.Text;
                    cmd.Connection = con;

                    using (SqlDataReader sdr = cmd.ExecuteReader())
                    {
                        while (sdr.Read())
                        {
                            chartData.Add(new object[]
                    {
                        sdr["RegionLoginOID"], sdr["RegionName"], sdr["SponserID"], sdr["Child_Id"]
                    });
                        }
                    }
                    
                    return chartData;
                }
            }
        }

标签: javascriptc#asp.net

解决方案


推荐阅读