• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 3472
  • Last Modified:

highlight row on mouse over in a Gridview

i have databound gridview. i want to highlight a row on mouse over. I have tried different codes from online examples but they dont work . The code i have used is


Protected Sub GvEmployee_RowCreated(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles GvEmployee.RowCreated

        If (e.Row.RowType = DataControlRowType.DataRow) Then
            e.Row.Attributes.Add("onmouseover", "this.className='hightlighrow'")
            e.Row.Attributes.Add("onmouseout", "this.className='normalrow'")
        End If

    End Sub

and my css is like

 .normalrow
    {
        background-color:white;
       
    }
    .hightlighrow
    {
        background-color:#cccccc;
    }
any ideas  where the problem is n how can we fix it
i will appericate
I am using Vb.net
0
mmalik15
Asked:
mmalik15
1 Solution
 
VirusMinusCommented:
load your page in the browser and then do a view source of this table.

copy paste the code here.

sometimes it could be javascript's case sensitivity.

try onMouseOut and onMouseOver
0
 
cmhuntyCommented:
Hi

Found this tutorial. Code is very similar but uses javascript to change the background color of the row instead of the css class.

http://www.gridviewguy.com/ArticleDetails.aspx?articleID=172

Chris
0
 
SammyCommented:
I would use the RowDataBound instead of the RowCreated event of the grid view
move your code as it is to the RowDataBound and it should work Ok
I dont see any problem with the logic or the css class
one more thing you can look at is viewing the source code when you run the app

Good luck
Sammy
0
 
Alpesh PatelCommented:
Protected Sub grdFileStatus_RowDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.GridViewRowEventArgs) Handles grdFileStatus.RowDataBound

        If e.Row.RowIndex >= 0 Then
            e.Row.Attributes.Add("ID", "GridView1Row" & e.Row.RowIndex)
            e.Row.Attributes.Add("onMouseOver", "mouseovercolorchange(" & e.Row.RowIndex & ")")
            e.Row.Attributes.Add("onMouseOut", "mouseoutcolorchange(" & e.Row.RowIndex & ")")
        End If
end sub



-------------------------------------------------------------------------------------------------------------------------

now use that customize function
mouseovercolorchange(ID of the row)
{
document.getElementById(ID).class="AAAAAA";
}


this must work....... becouse this is the direct code i give u from my runing project
0
 
cmhuntyCommented:
Small amendment for last comment in open discussion. Should be .className in javascript so should look like:

    function mouseovercolorchange(ID)
    {              
    document.getElementById(ID).className="over";
    }
    function mouseoutcolorchange(ID)
    {
    document.getElementById(ID).className="";
    }
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now