Chèn các mục vào trình đơn thả xuống bootstrap từ Bảng SQL

Có một số cách để thực hiện điều đó trong WebForms, nhưng trước tiên bạn cần tạo DIV phần tử của menu thả xuống có thể truy cập từ Code Behind.

Xem đoạn mã này?

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

Lưu ý rằng tôi đã thêm 2 thuộc tính: id ="myDropdownMenu" và runat ="máy chủ" .

Sau đó, bạn có thể chuyển đến Code Behind để bắt đầu điền menu từ một nguồn dữ liệu.

Ít nhất có 2 cách để làm điều này, theo như tôi biết.

Bằng cách thao tác InnerHtml tài sản, như thế này:

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

Hoặc, bằng cách thêm menu làm điều khiển trẻ em , như thế này:

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

Đó là cuộc gọi của bạn, hãy chọn cuộc gọi nào.

Btw, chỉ để hoàn thành ví dụ này, bạn có thể thử gọi một trong các phương thức đó từ Page_Load sự kiện, như thế này:

CHỈNH SỬA:

Theo yêu cầu của bạn, tôi đã sửa đổi các mẫu bằng cách thêm kết nối vào một bảng trong cơ sở dữ liệu. Vì vậy, đây là mô-đun để tải dữ liệu:

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

Và đây là cách bạn nên gọi mô-đun:

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

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

Ồ, và hãy nhớ nhập hai thư viện này để làm cho mẫu này hoạt động:

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

Hy vọng nó sẽ hữu ích.