GridViewRow Headers 相互重叠

Question

我正在研究 ASP.NET C#。我正在用数据库中的数据填充 gridview。与 DataTable 绑定的 GridView 有一些列。我想用 Header 行对这些列进行分组。我尝试将这些 Header 行添加到 GridView，如下所示（示例代码）：

我尝试使用行索引进行操作，但没有任何反应。

protected void AddHeaders()
{
    GridViewRow vesselInfoRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);
    TableCell vesselInfotc = new TableCell();
    vesselInfotc.Text = "Vessel Information ";
    vesselInfotc.Style.Add("text-align", "center");
    vesselInfotc.Style.Add("font-size", "medium");
    vesselInfotc.Style.Add("font-weight", "bold");
    vesselInfotc.Style.Add("background-color", "#b7dee8");
    vesselInfotc.Style.Add("color", "black");
    vesselInfotc.ColumnSpan = 4;
    vesselInfoRow.Cells.Add(vesselInfotc);
    this.BerthScoreCardGridView.Controls[0].Controls.AddAt(0, vesselInfoRow);

    //
    GridViewRow vesselArrivalRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);

    TableCell vesselArrivaltc = new TableCell();
    vesselArrivaltc.Text = "Vessel Arrival ";
    vesselArrivaltc.Style.Add("text-align", "center");
    vesselArrivaltc.Style.Add("font-size", "medium");
    vesselArrivaltc.Style.Add("font-weight", "bold");
    vesselArrivaltc.Style.Add("background-color", "#b7dee8");
    vesselArrivaltc.Style.Add("color", "black");
    vesselArrivaltc.ColumnSpan = 2;
    vesselArrivalRow.Cells.Add(vesselArrivaltc);

    this.BerthScoreCardGridView.Controls[0].Controls.AddAt(0, vesselArrivalRow);


}

然而，各行如下所示彼此重叠：

如何将它们水平并排放置。感谢你的帮助。

Answer 1

您应该将所有单元格添加到同一行并将该行添加到 GridView：

protected void AddHeaders()
{
    GridViewRow topHeaderRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);

    TableCell vesselInfotc = new TableCell();
    vesselInfotc.Text = "Vessel Information ";
    ...
    vesselInfotc.ColumnSpan = 4;
    topHeaderRow.Cells.Add(vesselInfotc);

    TableCell vesselArrivaltc = new TableCell();
    vesselArrivaltc.Text = "Vessel Arrival ";
    ...
    vesselArrivaltc.ColumnSpan = 2;
    topHeaderRow.Cells.Add(vesselArrivaltc);

    // Add the other cells here
    ...

    BerthScoreCardGridView.Controls[0].Controls.AddAt(0, topHeaderRow);
}

并在 GridView 的 PreRender 事件中调用您的函数：

void BerthScoreCardGridView_PreRender(object sender, EventArgs e)
{
    AddHeaders();
}

GridViewRow Headers 相互重叠

GridViewRow Headers placed above each other

c#

asp.net

gridview

datarow