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

Question

I want to change the color of particular row selected in the grid. How is it possible for my web application? Please suggest me.

Answer 1

You have to add some javascript to every row in code-behind. Handle onmouseover event and change background color: Change GridView row color based on condition

Answer 2

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

Answer 3

In your GridView, add the SelectedRowStyle-property and use the BackColor-property to set the color of the selected row.

So your GridView will look like this:

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

Answer 4

If this is a GridView control that we are talking about here, then you can just make use of the <SelectedRowStyle>

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

    <Columns></Columns>

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

</asp:GridView>

Style this up accordingly.

Answer 5

try this

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