如何在c#后面的代码中使用ul和li

本文关键字：ul li 代码 | 更新日期: 2023-09-27 18:02:10

我正在尝试使用我的数据库填充HTML文件的li和ul。单个类别表示数据库中的多个项目。

我已经采取了li项目在一个字符串中，我用CATEGORY名称和[itemTemplate]代替[food]与ITEMS。问题在我的代码是类别名称是重复的每次作为新项目显示。我必须显示类别名称一次，并添加该类别内的所有相关项目。

String liTemplate = "<li><h4 class='menu-title-section'> <h4 class='menu-title-section'><a href='#appetizers'>[food]</a></h4>[itemTemplate]</li>";
String itemTemplate = "SOME ITEM TEMPLETE";
DataTable dt = dm.GetData("spTestMenu")
StringBuilder sb = new StringBuilder();
sb.Append("<ul class='our-menu'>");
String liTemplateWorkingCopy = String.Empty, itemTemplateWorkingCopy = String.Empty
foreach (DataRow level1DataRow in dt.Rows)
{
    liTemplateWorkingCopy = liTemplate;
    itemTemplateWorkingCopy = itemTemplate;
    SubCategoryName = level1DataRow["MealSubCatName"].ToString();
    if (!previusSubCat.Equals(SubCategoryName))
    {
        liTemplateWorkingCopy = liTemplateWorkingCopy.Replace("[food]", level1DataRow["MealSubCatName"].ToString());
        previusSubCat = SubCategoryName;
    }
    itemTemplateWorkingCopy = itemTemplateWorkingCopy.Replace("[foodtitle]", level1DataRow["itemName"].ToString());
    itemTemplateWorkingCopy = itemTemplateWorkingCopy.Replace("[imgsrc]", level1DataRow["imageURL"].ToString());
    itemTemplateWorkingCopy = itemTemplateWorkingCopy.Replace("[price]", level1DataRow["Price"].ToString());
    liTemplateWorkingCopy = liTemplateWorkingCopy.Replace("[itemTemplate]", itemTemplateWorkingCopy);
    sb.Append(liTemplateWorkingCopy);
    foodMenu.Text = sb.ToString();
}

如何在c#后面的代码中使用ul和li

可以设置runat="server"为<li>或<ul> .

<li class="abc" runat="server" id="first"></li>

我建议使用ListView控件。这样你就可以在代码之外维护HTML;这样更干净，也更优雅。

按'MealSubCatName'列分组，并使用LINQ创建一个匿名对象:

c# 

var grouped = dt.AsEnumerable().GroupBy(c => c["MealSubCatName"].ToString())
    .Select(g => new
    {
        category = g.FirstOrDefault()["MealSubCatName"].ToString(),
        items = g.Select(r => new { 
            title = r["itemName"].ToString(), 
            image = r["imageURL"].ToString() 
        })
    });
lvFood.DataSource = grouped;
lvFood.DataBind();

ASPX 

<asp:ListView ID="lvFood" runat="server">
    <LayoutTemplate>
        <ul>
            <asp:PlaceHolder runat="server" ID="groupPlaceholder" />
        </ul>
    </LayoutTemplate>
    <GroupTemplate>
        <asp:PlaceHolder runat="server" ID="itemPlaceholder" />
    </GroupTemplate>
    <ItemTemplate>
        <li>
            <h4 class="menu-title-section">
                <a href="#appetizers"><%# Eval("category") %></a>
            </h4>
        </li>
        <asp:Repeater ID="rpt" runat="server" DataSource='<%# Eval("items") %>'>
            <ItemTemplate>
                <img src="<%# Eval("image")%>" alt="<%# Eval("title")%>" />
                <strong><%# Eval("title")%></strong><br />
            </ItemTemplate>
        </asp:Repeater>
    </ItemTemplate>
</asp:ListView>

添加一个带有runat server的div，并为该div分配一个Id，然后做一些像这样的事情，我在这里做了这个技巧www.journeycook.com检查这个网站的菜单

假设你有一个div id link和runat server在ul标签

<ul>
<div runat="server" id="link">
</div>
</ul>

现在添加c#代码，使用SqlDataReader类获取数据，并使用while循环执行如下操作

link.innerhtml+="<li>dr["yourcolumn"].ToString()</li>";

我希望它能给你一些帮助

相关文章：