ASP.NET GridView底部合计行样式设置方法咨询

当然可以实现，下面是几个实用的方案：

方案1：利用GridView的RowDataBound服务器端事件 #

这是最可靠的方式，适配包括分页在内的所有场景。

步骤： #

1. 在GridView控件标签中绑定RowDataBound事件：

<asp:GridView ID="GridView1" runat="server" OnRowDataBound="GridView1_RowDataBound" AutoGenerateColumns="True">
</asp:GridView>

2. 后台代码中实现事件逻辑：
   如果合计行固定在数据集最后两行，可直接判断行索引；更推荐在SQL查询时给合计行添加标识字段（比如IsTotal=1），用标识判断能避免数据行数变化导致的判断错误。

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
    // 仅处理数据行
    if (e.Row.RowType != DataControlRowType.DataRow) return;

    GridView grid = sender as GridView;

    // 方法A：判断是否为最后两行（适合合计行固定在末尾的场景）
    if (e.Row.RowIndex == grid.Rows.Count - 1 || e.Row.RowIndex == grid.Rows.Count - 2)
    {
        // 给行添加CSS类，方便统一控制样式
        e.Row.CssClass = "total-row";
        // 也可直接设置行内样式
        // e.Row.BackColor = System.Drawing.Color.LightGray;
        // e.Row.Font.Bold = true;
    }

    // 方法B：通过SQL标识字段判断（更稳定）
    // 假设SQL查询时给合计行加了IsTotal字段，值为1
    // bool isTotal = Convert.ToBoolean(DataBinder.Eval(e.Row.DataItem, "IsTotal"));
    // if (isTotal)
    // {
    //     e.Row.CssClass = "total-row";
    // }
}

3. 添加CSS样式（放在页面<style>标签或外部样式表中）：

.total-row {
    background-color: #f8f8f8;
    font-weight: bold;
    border-top: 2px solid #ccc;
}

方案2：客户端JavaScript处理 #

如果不想编写服务器端代码，也可以用JS在页面加载后给最后两行添加样式：

window.addEventListener('load', function() {
    const grid = document.getElementById('GridView1');
    if (!grid || grid.rows.length < 2) return;
    
    // 获取倒数第一、第二行并添加样式类
    grid.rows[grid.rows.length - 1].classList.add('total-row');
    grid.rows[grid.rows.length - 2].classList.add('total-row');
});

同样需要配合上述total-row CSS样式，这种方式适合无需分页的场景，逻辑简单直接。

注意事项 #

• 如果GridView开启了分页，需确保合计行在当前页底部（通常合计行不会参与分页，查询时要单独处理数据集，将合计行追加在当前页数据之后）。
• 用SQL标识字段的方式最灵活，后续调整合计行位置时，无需修改后台逻辑，仅需调整SQL的标识值即可。

内容的提问来源于stack exchange，提问作者Gal Mor