【问题标题】:Inserting items into bootstrap-dropdown from SQL Table从 SQL 表中将项目插入 bootstrap-dropdown
【发布时间】:2018-02-21 20:22:08
【问题描述】:

我正在从事 asp.net 项目,我的语言背后的代码是 c#。我有一个引导下拉菜单,我想在其中从 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# 语言是非常可观的。

【问题讨论】:

  • 您需要指定您使用的 ASP.NET 环境类型。例如,您可以使用 C# 使用 WebForms、MVC、Core、Web API 等制作 Web 应用程序...
  • 抱歉,WebForms 不是我的专业领域。我会将关键字 WebForms 添加到您的问题中并将其作为标签包含在内。
  • 没关系@DavidLee,感谢您的标签。我之前的评论被删除了。

标签: c# mysql sql twitter-bootstrap drop-down-menu


【解决方案1】:

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

看到这个sn-p了吗?

<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;

希望对你有帮助。

【讨论】:

  • 兄弟 我尝试在我的项目中实现你的代码,但是没有成功。看来您的代码是正确的,我不知道如何使用它。你能用一个例子清楚地解释我如何使用它。请使用连接字符串、一个示例表字段和 sql 查询向我解释。希望你能明白我要说的话.....@Erlangga
  • 做我的客人,兄弟:)
  • 很高兴听到这个消息,我的朋友
  • 这个解决方案简单而优雅——而且很少见!很多小时都在寻找这个解决方案。谢谢。
猜你喜欢
  • 2015-05-13
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2013-06-03
  • 2017-09-19
  • 1970-01-01
  • 2014-08-28
相关资源
最近更新 更多