如何在ASP.NET中使用Repeater控件将数据库列数据作为表头展示

Got it, let's figure out how to make the Repeater control dynamically render your database table's columns as table headers, instead of hardcoding those <th> tags. I'll walk you through this step by step, working with the code snippet you already have.

Step 1: Fetch Column Names from the Database (Backend) #

First, we need to pull the column names from your target table. I'll use ADO.NET here—just swap out the connection string and table name with your actual values:

protected void Page_Load(object sender, EventArgs e)
{
    if (!IsPostBack)
    {
        // Replace with your actual connection string from web.config
        string connString = ConfigurationManager.ConnectionStrings["YourDbConnection"].ConnectionString;
        DataTable columnNames = new DataTable();

        using (SqlConnection conn = new SqlConnection(connString))
        {
            // Replace 'CourseTable' with your database table name
            string getColumnsQuery = "SELECT COLUMN_NAME FROM INFORMATION_SCHEMA.COLUMNS WHERE TABLE_NAME = 'CourseTable'";
            SqlCommand cmd = new SqlCommand(getColumnsQuery, conn);
            SqlDataAdapter adapter = new SqlDataAdapter(cmd);
            adapter.Fill(columnNames);
        }

        // Bind column names to the header Repeater
        rptTableHeader.DataSource = columnNames;
        rptTableHeader.DataBind();

        // Bind the actual table data to another Repeater for rows
        BindCourseData();
    }
}

private void BindCourseData()
{
    string connString = ConfigurationManager.ConnectionStrings["YourDbConnection"].ConnectionString;
    DataTable courseData = new DataTable();

    using (SqlConnection conn = new SqlConnection(connString))
    {
        string getDataQuery = "SELECT * FROM CourseTable";
        SqlCommand cmd = new SqlCommand(getDataQuery, conn);
        SqlDataAdapter adapter = new SqlDataAdapter(cmd);
        adapter.Fill(courseData);
    }

    rptTableData.DataSource = courseData;
    rptTableData.DataBind();
}

Step 2: Update Your Frontend to Use Repeaters #

We'll replace your hardcoded header row with a Repeater that generates <th> tags dynamically. We'll also keep your existing Label row and add a second Repeater to render the data rows:

<table class="table table-bordered table-hover">
    <thead>
        <!-- Repeater for dynamic table headers -->
        <asp:Repeater ID="rptTableHeader" runat="server">
            <HeaderTemplate>
                <tr class="text-center">
            </HeaderTemplate>
            <ItemTemplate>
                <th><%# Eval("COLUMN_NAME") %></th>
            </ItemTemplate>
            <FooterTemplate>
                </tr>
            </FooterTemplate>
        </asp:Repeater>
        <!-- Your existing Label row (dynamic colspan to match column count) -->
        <tr>
            <td colspan="<%= rptTableHeader.Items.Count %>">
                <asp:Label ID="Label5" runat="server" Text="Label"></asp:Label>
            </td>
        </tr>
    </thead>
    <tbody>
        <!-- Repeater for dynamic data rows -->
        <asp:Repeater ID="rptTableData" runat="server">
            <ItemTemplate>
                <tr class="text-center">
                    <%-- Loop through each column in the current row to generate cells --%>
                    <% foreach (DataColumn col in ((DataRowView)Container.DataItem).Row.Table.Columns) { %>
                        <td><%# DataBinder.Eval(Container.DataItem, col.ColumnName) %></td>
                    <% } %>
                </tr>
            </ItemTemplate>
        </asp:Repeater>
    </tbody>
</table>

Quick Notes to Make This Work #

• Connection String: Ensure your web.config has a valid connection string named YourDbConnection (or update the code to match your actual connection string name).
• Table Name: Swap CourseTable with the name of your database table in both SQL queries.
• Dynamic Colspan: I updated the Label row's colspan to use <%= rptTableHeader.Items.Count %> so it automatically matches the number of columns—no more hardcoding fixed values!
• Other Databases: If you're using MySQL instead of SQL Server, the column-fetching query will change to SELECT COLUMN_NAME FROM INFORMATION_SCHEMA.COLUMNS WHERE TABLE_SCHEMA = 'YourDatabaseName' AND TABLE_NAME = 'CourseTable' or use DESCRIBE CourseTable.

内容的提问来源于stack exchange，提问作者Adeel Rana