Home > ASP.Net > Highlight GridView row OnMouseOver

Highlight GridView row OnMouseOver


Hi

try this example to Highlight GridView row onmouseover

protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
    {
        if (e.Row.RowType == DataControlRowType.DataRow)
        {
            // when mouse over the row, change the bg color to it
            e.Row.Attributes.Add("onmouseover",
          "this.originalstyle=this.style.backgroundColor;this.style.backgroundColor='#EEFF00'");

            // when mouse leaves the row, change the bg color to its original value   
            e.Row.Attributes.Add("onmouseout",

            "this.style.backgroundColor=this.originalstyle;");

        }
    }

//——— another way

protected void GridView1_RowCreated(object sender, GridViewRowEventArgs e)
    {
        e.Row.Attributes.Add("onMouseOver", "this.style.background='#eeff00'");
        e.Row.Attributes.Add("onMouseOut", "this.style.background='#ffffff'");       
    }

//——— another way

<script language="javascript">

function Highlight(row)
{
row.style.backgroundColor='red';
}

function UnHighlight(row)
{
row.style.backgroundColor='white';
}

</script>

and in code behind :

protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
e.Row.Attributes.Add("onMouseOver", "Highlight(this)");

e.Row.Attributes.Add("onMouseOut", "UnHighlight(this)");
}
}

//———- another way

protected void HighLightRow(GridViewRowEventArgs e, string OriginalColor, string OnMouseOverColor,
    string OriginalFontColor, string onMouseOverFontColor)
{
    if (e.Row.RowType == DataControlRowType.DataRow)
    {
        e.Row.Attributes.Add("onmouseover", "this.style.background='" + OnMouseOverColor +
            "';this.style.color='" + onMouseOverFontColor + "';");
        e.Row.Attributes.Add("onmouseout", "this.style.background='" + OriginalColor +
            "';this.style.color='" + OriginalFontColor + "';");
    }
}
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
       HighLightRow(e, "#86CCF7", "#C0E2F7","Black","Black");
}

Hope this helps

Good Luck

Advertisements
Categories: ASP.Net
  1. No comments yet.
  1. No trackbacks yet.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: