从代码隐藏在 aspx 中添加 <ul> <li> 列表答案

【问题标题】：Add <ul> <li> list in aspx from code-behind从代码隐藏在 aspx 中添加 <ul> <li> 列表
【发布时间】：2013-05-28 05:22:39
【问题描述】：

我正在尝试在后面的代码中创建嵌套的 ul 和 li 标签。为此，我在.aspx 页面中编写了初步代码

<ul class="dropdown" runat="server" id="tabs"> </ul>

我的 C# 代码

DatTable dtOutput = Generix.getData("Get Some Data");

foreach (DataRow drOutput in dtOutput.Rows)
{
    HtmlGenericControl li = new HtmlGenericControl("li");                    
    tabs.Controls.Add(li);
    HtmlGenericControl anchor = new HtmlGenericControl("a");
    anchor.Attributes.Add("href", "#");
    anchor.InnerText = Convert.ToString(drOutput["ModuleGroup"]);
    li.Controls.Add(anchor);
    HtmlGenericControl ul = new HtmlGenericControl("ul");

    DatTable dtOutputList = Generix.getData("Get another set of Data");

    foreach (DataRow drOutputList in dtOutputList.Rows)
    {                        
        HtmlGenericControl ili = new HtmlGenericControl("li");
        ul.Controls.Add(ili);
        HtmlGenericControl ianchor = new HtmlGenericControl("a");
        foreach (DataColumn dcOutputList in dtOutputList.Columns)
        {
            ianchor.Attributes.Add("href", Convert.ToString(drOutputList["ModuleFileName"]));
        }
        ianchor.InnerText = Convert.ToString(drOutputList["ModuleName"]);
        ili.Controls.Add(ianchor);                        
    }
    //tabs.Controls.Add(li);
}

当我运行我的项目并检查菜单上的元素时，我看到类似

<ul id="ctl00_tabs" class="dropdown">
    <li class="">
        <a href="#">Master</a>
    </li>
    <li class="">
        <a href="#">Cards Management</a>
    </li>
    <li class="">
        <a href="#">Authorization</a>
    </li>
    <li class="">
        <a href="#">Loyalty</a>
    </li>
    <li class="">
        <a href="#">Reports</a>
    </li>
</ul>

没有在li 内创建嵌套的ul 标记？？为什么？

例如：-

<ul id="ctl00_tabs" class="dropdown">
    <li class="">
        <a href="#">Master</a>
        <ul>
            <li><a href="Some.aspx"><span>Some Name</span></a></li>
            <li><a href="Some1.aspx"><span>Some Name 1</span></a></li>
        </ul>
    </li>
</ul>

【问题讨论】：

那么....有什么问题？
使用我当前的 c# 代码我无法在其各自的列表标题中添加 li 元素
列表标题是我的 DataTable 的 ModuleGroup 列
使用Repeater 等数据绑定控件生成这样的标记更为常见。将Repeater 控件添加到您的aspx 页面并将其绑定到您的DataTable。您可以通过谷歌搜索找到更多信息和示例，例如“Repeater ul”。
我遇到了类似的问题，并尝试使用此页面上提到的解决方案。但是，我在尝试访问“tabs.something”时遇到空引用异常。我还需要为“ul tabs”初始化一个对象吗？

标签： c# html asp.net

【解决方案1】：

这里的问题是您要向锚点添加多个 Href 属性。可能每次都覆盖href。将您的代码更改为：

foreach (DataRow drOutput in dtOutput.Rows)
{
    HtmlGenericControl li = new HtmlGenericControl("li");
    tabs.Controls.Add(li); // tabs is id of ul tag which is runat=server
    foreach (DataColumn dcOutput in dtOutput.Columns)
    {
        HtmlGenericControl anchor = new HtmlGenericControl("a");
        anchor.Attributes.Add("href", Convert.ToString(drOutput["ModuleFileName"]));
        anchor.InnerText = Convert.ToString(drOutput["ModuleName"]);
        li.Controls.Add(anchor);
    }
}

【讨论】：

你还是没有得到我的问题.. 上面的代码如何根据我的 DataTable 列 "ModuleName" 生成嵌套的 ul 和 li 标签
他在哪里添加多个href属性？
在循环中，他正在做foreach() anchor.Attributes.Add。 @SagarDumbre：正如在别处指出的那样，您实际上从未将内部 UL 添加到 li 元素的子控件集合中。

【解决方案2】：

你知道你打电话给li.Controls.Add(anchor)了吗？您没有在任何地方调用li.Controls.Add(ul)，因此您创建的uls 实际上并没有被添加到页面上的任何位置。

【讨论】：

我在第二个循环中调用ul.Controls.Add(ili);，因为它是inner ul，而outer ul 在我的aspx 页面中被硬编码为id=tabs
是的，您将内部列表项添加到内部列表中，但您根本没有将内部列表添加到外部列表项中。
好的。拨打li.Controls.Add(anchor)后，拨打li.Controls.Add(ul)。

【解决方案3】：

您可以通过以下方式使用c#代码将LI项目添加到UL项目

<ul class="respond" id="feedbackTab" runat="server"></ul> 

HtmlGenericControl li = new HtmlGenericControl("li");
feedbackTab.Controls.Add(li);

HtmlGenericControl anchor = new HtmlGenericControl("a");
anchor.Attributes.Add("href", "aboutme.aspx");
anchor.InnerText = "Tab Text";

欲了解更多信息，您可以访问此链接：http://www.sharepointsol.com/2014/09/dynamically-adding-li-to-ul.html

【讨论】：

【解决方案4】：

你可以试试这个代码：

aspx:

<form id="form1" runat="server">
        <div>


            <asp:PlaceHolder ID="ControlContainer"
                runat="server" />
        </div>
</form>

cs:

HtmlGenericControl tabs = new HtmlGenericControl("ul");
            tabs.ID = "myTopnav";
            tabs.Attributes.Add("class", "topnav");

            HtmlGenericControl li = new HtmlGenericControl("li");
            HtmlGenericControl ianchor = new HtmlGenericControl("a");

            li = new HtmlGenericControl("li");
            ianchor = new HtmlGenericControl("a");
            ianchor.ID = "Home";
            ianchor.Attributes.Add("href", "#home");
            ianchor.Attributes.Add("class", "active");
            ianchor.InnerText = "Home";
            li.Controls.Add(ianchor);
            tabs.Controls.Add(li);


            li = new HtmlGenericControl("li");
            ianchor = new HtmlGenericControl("a");
            ianchor.ID = "News";
            ianchor.Attributes.Add("href", "#");
            ianchor.InnerText = "News";
            li.Controls.Add(ianchor);
            tabs.Controls.Add(li);

            ControlContainer.Controls.Add(tabs);

【讨论】：