如何在 C# Web 应用程序的网格中更改选定行的颜色？答案

【问题标题】：How do I change color of selected Row in the Grid in C# web application?如何在 C# Web 应用程序的网格中更改选定行的颜色？
【发布时间】：2012-09-06 06:47:12
【问题描述】：

我想更改在网格中选定的特定行的颜色。我的网络应用程序怎么可能？请给我建议。

【问题讨论】：

你是如何选择你的行的。它是 Gridview 的选择事件吗？
我用 DataControlRowType 试过了，但它不起作用
你需要使用GridView的RowCreated-Event。我认为你需要类似 [this][1] [1]: stackoverflow.com/questions/6250545/…
aspsnippets.com/Articles/…

标签： c# asp.net background-color

【解决方案1】：

试试这个

    <style type="text/css">
    .row-highlight
    {
        background-color: Yellow;
    }
    .row-select
    {
        background-color: red;
    }
</style>

<asp:GridView ID="GridView1" runat="server">

</asp:GridView>
<script type="text/javascript">
    $(function () {
        var tr = $('#<%= GridView1.ClientID %>').find('tr');

        tr.hover(
             function () {  // mouseover
                 $(this).addClass('row-highlight');
             },
             function () {  // mouseout
                 $(this).removeClass('row-highlight');
             }
        );
        tr.click(function() {
            $(this).addClass('row-select');
        });
    });

</script>

【讨论】：

您是否遇到任何错误。它为我工作。您需要添加 jQuery 的引用

【解决方案2】：

您必须在代码隐藏的每一行中添加一些 javascript。处理 onmouseover 事件并更改背景颜色： Change GridView row color based on condition

【讨论】：

【解决方案3】：

为每个复选框附加一个 onclick javascript 函数，如果选中该复选框，则为该行分配一些 css 类，这将突出显示整行。

【讨论】：

【解决方案4】：

在您的 GridView 中，添加 SelectedRowStyle 属性并使用 BackColor 属性设置所选行的颜色。

所以您的 GridView 将如下所示：

<asp:GridView ID="GridTest" runat="server" DataSourceID=... >
   <Columns>
   ...
   </Columns>
   <SelectedRowStyle BackColor="#E2DED6"/>
</asp:GridView>

【讨论】：

【解决方案5】：

如果这是我们在这里讨论的GridView 控件，那么您可以使用<SelectedRowStyle>

<asp:GridView id="GridView1" runat="Server">

    <Columns></Columns>

    <SelectedRowStyle CssClass="selectedRowStyle" BackColor="LightCyan"
        ForeColor="DarkBlue"
        Font-Bold="true" />

</asp:GridView>

相应地设置样式。

【讨论】：

Kemboj - 您还需要在 RowCommand 中设置 Selected Row 索引。