从c#代码后面创建LI到ASPX页面

本文关键字：LI ASPX 页面 创建 代码 | 更新日期: 2023-09-27 18:02:21

我有一个带有asp:BulletedList控件的ASPX页面，我想使用c#从代码后填充。

这是我的SQL表(TBook): 
LOCATION
New Rochelle
Purchase
Rye
Scarsdale
White Plains
Yonkers

我的ASP页面目前看起来是这样的:

<div style="width: 80%; margin: 0 auto; border: 1px solid #A7DFFF; background: #DDDDDD;">
        <div style="width: 100%; background: #0181C7; height: 50px; line-height: 50px;">
            <span style="color: #fff;text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135;font: 35px 'ChunkFiveRegular';">LOCATIONS</span>
        </div>
        <div style="height: 15px;"></div>
        <asp:BulletedList class="ulLocation" id="ulLocation_selector" runat="server">  
        </asp:BulletedList>
        <!--<ul class="ulLocation" id="ulLocation2_selector" runat="server">
            <li class="liSubLocation active" data-trait-id="9">
                <a href="/locations/new-york/neighborhoods?tags[]=12&amp;tags[]=66" class="premote trait-link large btn" data-trait-id="9">
                    <span class="check"><i class="icon icon-ok"></i></span>
                    <span class="name">New Rochelle</span>
                    <span class="count">6</span>
                </a>
            </li>
            <li class="liSubLocation active" data-trait-id="12">
                <a href="/locations/new-york/neighborhoods?tags[]=66&amp;tags[]=9" class="premote trait-link large btn" data-trait-id="12">
                    <span class="check"><i class="icon icon-ok"></i></span>
                    <span class="name">Purchase</span>
                    <span class="count">6</span>
                </a>
            </li>
            <li class="liSubLocation" data-trait-id="14">
                <a href="/locations/new-york/neighborhoods?tags[]=12&amp;tags[]=14&amp;tags[]=66&amp;tags[]=9" class="premote trait-link large btn" data-trait-id="14">
                    <span class="check"><i class="icon icon-ok"></i></span>
                    <span class="name">Rye</span>
                    <span class="count">4</span>
                </a>
            </li>
            <li class="liSubLocation" data-trait-id="5">
                <a href="/locations/new-york/neighborhoods?tags[]=12&amp;tags[]=5&amp;tags[]=66&amp;tags[]=9" class="premote trait-link large btn" data-trait-id="5">
                    <span class="check"><i class="icon icon-ok"></i></span>
                    <span class="name">Scarsdale</span>
                    <span class="count">6</span>
                </a>
            </li>
            <li class="liSubLocation" data-trait-id="3">
                <a href="/locations/new-york/neighborhoods?tags[]=12&amp;tags[]=3&amp;tags[]=66&amp;tags[]=9" class="premote trait-link large btn" data-trait-id="3">
                    <span class="check"><i class="icon icon-ok"></i></span>
                    <span class="name">White Plains</span>
                    <span class="count">5</span>
                </a>
            </li>
            <li class="liSubLocation active" data-trait-id="66">
                <a href="/locations/new-york/neighborhoods?tags[]=12&amp;tags[]=9" class="premote trait-link large btn" data-trait-id="66">
                    <span class="check"><i class="icon icon-ok"></i></span>
                    <span class="name">Yonkers</span>
                    <span class="count">6</span>
                </a>
            </li>
        </ul>-->
    </div>
到目前为止，c#代码看起来像这样: 
string connectionString="Data Source=myServBook;InitialCatalog=MyDB; UserID=srvdb;" + 
                        "Password=servdbtest0980";
    protected void Page_Load(object sender, EventArgs e)
    {
        /*using(SqlConnection sqlConnection=new SqlConnection(connectionString))
{
     string insertStatement="SELECT FROM [MyDB].[dbo].[TBook]";
     SqlCommand sqlCommand=new SqlCommand(insertStatement,sqlConnection);
     /* ADD THE LI HERE */
     /*sqlConnection.Open();
     sqlCommand.ExecuteNonQuery();
}*/
    }

我有以下代码，添加基于数据源的LI:

DataTable dt = getData(); //Insert your datasource here
    foreach(DataRow row in dt.Rows){
        HtmlGenericControl li = new HtmlGenericControl("li");
        li.Attributes.Add("data-trait-id", row["TraitID"].ToString());
        HtmlAnchor a = new HtmlAnchor();
        a.Attributes.Add("data-trait-id", row["TraitID"].ToString());
        HtmlGenericControl span1 = new HtmlGenericControl("span");
        span1.Attributes.Add("class", "name");
        span1.InnerText = row["Name"].ToString();
        a.Controls.Add(span1);
        HtmlGenericControl span2 = new HtmlGenericControl("span");
        span2.Attributes.Add("class", "count");
        span2.InnerText = row["Count"].ToString();
        a.Controls.Add(span2);
        li.Controls.Add(a);
        ulSpecialty_selector.Controls.Add(li);
    }

上面的代码使用一个数据源。我如何修改它，使它根据表中的行数添加LI的数量，类似于ASPX页面中注释掉的HTML代码?

Link = "#"
Name = Table Row Value
Count = Table Row Number

从c#代码后面创建LI到ASPX页面

这是我为你想出的，唯一的问题是你想要一个数字在右边，这个解决方案不会做到这一点。不过，你可以使用中继器，这样你就可以把你的号码放在右边。无论如何，这是一些让你度过难关的想法，直到有人给出更好的解决方案。

        cblTest.DataSource = "YourDataTableOrDataset";
        cblTest.DataValueField = "YourIDColumnFromYourTable";
        cblTest.DataTextField = "YourColumnName";
        cblTest.RepeatDirection = RepeatDirection.Horizontal;//Option of vertical
        cblTest.RepeatColumns = 5; //or however many you need i.e how many columns you want to go across before repeating
        cblTest.CssClass = "YourCSSClass"; //for styling the checkboxlist
        cblTest.DataBind();
相关文章：