在 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;
希望对你有帮助。