ASP.NET中如何更改GridView的行颜色

Question

我有一个显示两个表格的gridview（使用合并方法）。我想要改变第0行和第11行的颜色。我知道可以在行数据绑定事件中实现，但是我不知道如何在运行时选择这些行。

我的后台代码：

public void mergetbl(DataTable DocVisTbl, DataTable cobtable)
{

    DataTable mergetable = DocVisTbl.Copy();
    mergetable.Merge(cobtable);

    DataRow row;
    row = mergetable.NewRow();
    row["Stakeholder"] = "Número de Médicos";
    mergetable.Rows.InsertAt(row, 0);
    row = mergetable.NewRow();
    row["Stakeholder"] = "Médicos Visitados";
    mergetable.Rows.InsertAt(row, 11);


    DataTable mergetable_Clone = mergetable.Clone(); //just copy structure, no data

    for (int i = 0; i < mergetable_Clone.Columns.Count; i++)
    {
        if (mergetable_Clone.Columns[i].DataType != typeof(string))
            mergetable_Clone.Columns[i].DataType = typeof(string);
    }

    foreach (DataRow datarow in mergetable.Rows)
    {
        mergetable_Clone.ImportRow(datarow);

    }

    for (int x = 1; x < mergetable_Clone.Columns.Count; x++)
    {
        mergetable_Clone.Rows[4][x] = mergetable_Clone.Rows[4][x] + "%";
        mergetable_Clone.Rows[7][x] = mergetable_Clone.Rows[7][x] + "%";
        mergetable_Clone.Rows[10][x] = mergetable_Clone.Rows[10][x] + "%";
        mergetable_Clone.Rows[15][x] = mergetable_Clone.Rows[15][x] + "%";
        mergetable_Clone.Rows[18][x] = mergetable_Clone.Rows[18][x] + "%";
        mergetable_Clone.Rows[21][x] = mergetable_Clone.Rows[21][x] + "%";

    }
    MergeGrid.DataSource = mergetable_Clone;
    MergeGrid.DataBind();        
}

protected void MergeGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
    //if (e.Row.RowType == DataControlRowType.DataRow)
    //{
    //
    //}
}

我的CSS代码

 .Grid {   
    width: auto; 
    background-color: #fff;   
    margin: 5px 0 10px 0;   
    border: solid 2px #525252;   
    border-collapse:collapse;   }  

/*Gridview table data*/
.Grid td {   
    padding: 2px;  
    font-family: Calibri; 
    border: solid 1px #c1c1c1;   
    color: #000000;   
    text-align:right;
    padding: 2px 4px 3px 4px;}  

/*Gridview table header*/
.Grid th {   
    padding: 4px 2px;   
    color: #fff; 
    font-family:Calibri;
    background: #424242 url(Images/gridheader.png) repeat-x top;   
    border-left: solid 1px #525252;   
    font-size: 95%;   }  

/*Gridview alternate rows*/
.Grid .alt { background: #fcfcfc url(Images/grid-alt.png) repeat-x top; }  

- Mara Pimentel

---

样式更改应使用 CSS 完成。 - DLeh

我对 CSS 做了一些更改，但我认为用 C# 更容易。因为我不知道怎么做，所以可以展示我的 CSS 代码。@DLeh - Mara Pimentel

像任何工作一样，您应该使用适当的语言。业务逻辑应该用C#完成，前端样式应该用css完成。如果混合使用，遇到问题时会遇到麻烦。我建议您向我们展示表格相关的css代码。 - Drew Kennedy

@MaraPimentel 你可以通过RowIndex属性在RowDataBound中获取行的索引。 - ale

我更新了我的问题@DrewKennedy。 - Mara Pimentel

Answer 1

代码中的一个例子

protected void MergeGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        if (e.Row.RowIndex == 0) //Select the row
        {
            e.Row.BackColor = System.Drawing.Color.FromArgb(255, 0, 0);

            //or you can select the color
            //e.Row.BackColor = System.Drawing.Color.Red;
        }
    }
}

我希望能够帮助你。

- Nacho

---

它对我起作用了！谢谢你！太容易了 ;) @Nacho - Mara Pimentel

@MaraPimentel 不用谢！希望我能有所帮助！ - Nacho

Answer 2

首先，您可以选择其他方式来完成此任务，本文仅提供一种方法，您也可以根据此方法编写另一种解决方案：

    protected void MergeGrid_RowDataBound(object sender, GridViewRowEventArgs e)
{
    //here you should have a way to identify which rows are you goingo to change
    //I used the text in the first row
    string[] rowsToColor = new[] { "Número de Médicos", "Médicos Visitados" };
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        if (rowsToColor.Contains(e.Row.Cells[0].Text))
        e.Row.BackColor =  System.Drawing.Color.Blue; //it is just an example color
    }
}

- Enrique Zavaleta

Answer 3

在你的 DataBind 后面执行这个操作。

MergeGrid.DataBind();
MergeGrid.Rows[0].BackColor = 
    gvwSearch.Rows[11].BackColor = 
    System.Drawing.Color.Red;

不需要使用 RowDataBound 事件。

- naveen

Answer 4

你已经接近成功了，但是你停了下来。

这些方法中的任何一种都可以使用。

1. Use the row index:

   private const int ROW_00 = 0;
   private const int ROW_11 = 11;
   
   protected void MergeGrid_RowDataBound(object sender, GridViewRowEventArgs e)
   {
       if (e.Row.RowType == DataControlRowType.DataRow)
       {
           var index = e.Row.RowIndex;
           if ((index == ROW_00) || (index == ROW_11))
           {
               e.Row.BackColor = System.Drawing.Color.Aqua;
           }
       }
   }
   

2. Use the row's text (substituting the English versions I have with your Spanish equivalent):

   private const string NUMERO_DE_MEDICOS = "Numero de Medicos";
   private const string MEDICOS_VISITADOS = "Medicos Visitados";
   
   protected void MergeGrid_RowDataBound(object sender, GridViewRowEventArgs e)
   {
       if (e.Row.RowType == DataControlRowType.DataRow)
       {
           var cell0 = e.Row.Cells[0].Text;
           if ((cell0 == NUMERO_DE_MEDICOS) || (cell0 == MEDICOS_VISITADOS))
           {
               e.Row.BackColor = System.Drawing.Color.Aqua;
           }
       }
   }
   

- user153923