четверг, 10 ноября 2011 г.

Change background color of row on mouse over in ASPxGridview using C#

When moving the mouse over a row, it will change to a color of my choice. And, when the mouse moves off the row, the color will back to a color it used to be. I am setting the hover background color of the row in the HtmlRowCreated event.
GridviewRowHoverColor.aspx
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="GridviewRowHoverColor.aspx.cs" Inherits="GridviewRowHoverColor" %>

<%@ Register Assembly="DevExpress.Web.ASPxGridView.v10.2, Version=10.2.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a"
    Namespace="DevExpress.Web.ASPxGridView" TagPrefix="dx" %>

<%@ Register assembly="DevExpress.Web.ASPxEditors.v10.2, Version=10.2.4.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxEditors" tagprefix="dx" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <dx:ASPxGridView ID="ASPxGridView1" runat="server" AutoGenerateColumns="False"
            ClientIDMode="AutoID" DataSourceID="SqlDataSource1" KeyFieldName="ID"
            onhtmlrowcreated="ASPxGridView1_HtmlRowCreated">
            <Columns>
                <dx:GridViewDataTextColumn FieldName="ID" ReadOnly="True" VisibleIndex="0">
                    <EditFormSettings Visible="False" />
                </dx:GridViewDataTextColumn>
                <dx:GridViewDataTextColumn FieldName="Data" VisibleIndex="1">
                </dx:GridViewDataTextColumn>
                <dx:GridViewDataTextColumn FieldName="Status" VisibleIndex="2">
                </dx:GridViewDataTextColumn>
            </Columns>
        </dx:ASPxGridView>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server"
            ConnectionString="<%$ ConnectionStrings:testConnectionString %>"
            SelectCommand="SELECT [ID], [Data], [Status] FROM [testTable]"></asp:SqlDataSource>
    </div>
    </form>
</body>
</html>

GridviewRowHoverColor.aspx.cs
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;

public partial class GridviewRowHoverColor : System.Web.UI.Page
{
    protected void Page_Load(object sender, EventArgs e)
    {

    }
    protected void ASPxGridView1_HtmlRowCreated(object sender, DevExpress.Web.ASPxGridView.ASPxGridViewTableRowEventArgs e)
    {
        e.Row.Attributes.Add("onmouseover", "defcolor=this.style.backgroundColor;this.style.backgroundColor='#F5F1EE';");
        e.Row.Attributes.Add("onmouseout", "this.style.backgroundColor=defcolor;");
    }
}

Комментариев нет:

Отправить комментарий