如何在C＃Web应用程序的网格中更改所选行的颜色？

Question

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

Answer 1

您必须在代码隐藏的每一行中添加一些javascript。 处理onmouseover事件并更改背景颜色： 根据条件更改GridView行颜色

Answer 2

在每个复选框上附加一个onclick javascript函数，然后选中该复选框，然后为该行分配一些CSS类，这将突出显示整个行。

Answer 3

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

因此，您的GridView将如下所示：

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

Answer 4

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

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

    <Columns></Columns>

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

</asp:GridView>

相应地设置样式。

Answer 5

尝试这个

    <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>