c# - 从 SQL 表中将项目插入到 Bootstrap 下拉列表中

Question

我正在从事 asp.net 项目，我的代码背后语言是 c#。我有一个 Bootstrap 下拉列表，我想在其中从 SQL 表中获取项目。有没有人会在这方面帮助我。提前致谢。

<li class="nav-item dropdown">
    <a class="btn btn-light dropdown-toggle" href="#" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
        Category
    </a>
    <div class="dropdown-menu" aria-labelledby="navbarDropdown">
        <a class="dropdown-item" href="#">Action</a>
        <a class="dropdown-item" href="#">Another action</a>
        <a class="dropdown-item" href="#">Something else here</a>
    </div>
</li>

Action、Another Action 和 Something else 项目应该来自数据库(类别)表。在服务器端使用 c# 语言非常值得赞赏。

Answer 1

在 WebForms 中有一些方法可以做到这一点，但首先您需要使下拉菜单的 DIV 元素可以从代码隐藏中访问。

看到这个片段了吗？

<ul class="nav nav-tabs">
    <li class="nav-item dropdown">
        <a class="btn btn-light dropdown-toggle" href="#" id="navbarDropdown1" role="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
            Category
        </a>
        <div id="myDropdownMenu" runat="server" class="dropdown-menu" aria-labelledby="navbarDropdown">
        </div>
    </li>
</ul>

请注意，我添加了 2 个属性:id="myDropdownMenu" 和 runat="server"。

在此之后，您可以转到代码隐藏开始从数据源填充菜单。

据我所知，至少有两种方法可以做到这一点。

通过操纵 InnerHtml 属性，像这样:

    private void DisplayMenuByConstructingHtmlTags(List<string> menuList)
    {
        var menuHtml = "";

        foreach (string menuText in menuList)
        {
            menuHtml += "<a class=\"dropdown-item\" href=\"#\">" + menuText + "</a>\n";
        }

        myDropdownMenu.InnerHtml = menuHtml;
    }

或者，通过将菜单添加为子控件，如下所示:

    private void DisplayMenuByAddingChildControls(List<string> menuList)
    {
        foreach (string menuText in menuList)
        {
            var linkMenu = new HyperLink() { CssClass = "dropdown-item", NavigateUrl = "#", Text = menuText };
            myDropdownMenu.Controls.Add(linkMenu);
        }
    }

选择哪一个由您决定。

顺便说一句，为了完成这个示例，您可以尝试从 Page_Load 事件中调用其中一个方法，如下所示:

编辑:

根据您的要求，我已经通过添加到数据库表的连接来修改示例。所以，这是加载数据的模块:

    private List<string> LoadMenuFromTable()
    {
        string connectionString = ConfigurationManager.ConnectionStrings["YourConnectionStringName"].ToString();

        var retVal = new List<string>();
        using (var connection = new SqlConnection(connectionString))
        {
            using (var cmd = new SqlCommand("SELECT menu_text FROM Table_1", connection))
            {
                connection.Open();
                using (var reader = cmd.ExecuteReader())
                {
                    while (reader.Read())
                    {
                        retVal.Add((string)reader["menu_text"]);
                    }
                }
            }
        }
        return retVal;
    }

下面是您应该如何调用该模块:

    protected void Page_Load(object sender, EventArgs e)
    {
        var menu = LoadMenuFromTable();

        DisplayMenuByAddingChildControls(menu);
        // or DisplayMenuByConstructingHtmlTags(menu);
    }

哦，记得导入这两个库以使这个示例工作:

using System.Configuration;
using System.Data.SqlClient;

希望对您有所帮助。