javascript - 将 SQL 查询结果格式化为 Web 菜单

Question

我正在尝试为我的网站构建一个向下钻取菜单，用户将在其中单击一个类别，它会显示该单击类别的子类别，可能有 n 级。我可以编写 sql 查询，它可以根据需要准确返回输出，但问题是......我不想向最终用户显示整个菜单，我只想打开/展开单击的类别。

    my Query output is:

1 IPTV
2      Jadoo Tv
3      Shava Tv
4      Jalva Tv
5 Programming
6      Microsoft
7           Asp.Net
8      PHP

所以默认情况下应该显示 IPTV 和编程，因为它们是父级，当我单击 IPTV 时它应该打开 IPTV 的子级，就像我说的那样可能有 n 级。

我在想，我可以将查询的输出加载到网页，然后用 css/javascript 控制菜单导航。

你们有什么想法吗？

Answer 1

好的，这是标记的完整代码(在我从 sql sp 得到结果之后)。

    Private Sub CreateLeftMenu()

    Dim dt As DataTable = DAL.ReturnMSSQLData("EXEc CategoryTree")
    Dim str As New StringBuilder

    Dim catname As String = ""
    Dim catid As Integer = 0
    Dim parent As Integer = 0
    Dim sort As String = ""
    Dim keys As Array

    Dim display As String = "none"

    For Each item As DataRow In dt.Rows

        catname = Replace(item("CatName"), " ", " ")
        catid = item("id")
        parent = item("parent")
        sort = item("sort")

        If parent = 0 Then
            str.Append("<div class='group_" & parent & "'><a href='/pages/index.aspx?cat=" & sort & "' id='group_" & catid & "'>" & catname & "</a></div>")
        Else

            If Len(Me.GroupID) > 0 Then
                keys = Split(Me.GroupID, "_")

                For Each item1 As String In keys
                    If CInt(item1) = parent Then
                        str.Append("<div class='group_" & parent & "' style='display:block'><a style='text-decoration:none' href='/pages/index.aspx?cat=" & sort & "' id='group_" & catid & "'>" & catname & "</a></div>")
                    Else
                        'str.Append("<div class='group_" & parent & "' style='display:none'><a style='text-decoration:none' href='/pages/index.aspx?cat=" & sort & "' id='group_" & catid & "'>" & catname & "</a></div>")
                    End If
                Next

            End If



        End If

    Next

    LMenu.Text = str.ToString

End Sub