Question

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

我已将li项目放在字符串中，我将{food]替换为CATEGORY名称，将[itemTemplate]替换为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();
}

Answer 1

您可以为runat="server"或<li> ..

设置<ul>

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

Answer 2

我建议使用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>

Answer 3

使用runat服务器添加一个div，并为该div分配一个Id并执行类似这样的操作我在这里做了这个技巧www.journeycook.com查看本网站的菜单。

假设您在ul标记

中有id链接和runat服务器的div

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

</div>

</ul>

现在使用 SqlDataReader 类添加c＃代码以获取数据，并使用while循环执行类似此操作

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

我希望它会给你一些帮助

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

3 个答案: