• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 3469
  • 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

Featured Post

[Webinar On Demand] Database Backup and Recovery

Does your company store data on premises, off site, in the cloud, or a combination of these? If you answered “yes”, you need a data backup recovery plan that fits each and every platform. Watch now as as Percona teaches us how to build agile data backup recovery plan.

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