When you think ASP, think...
Recent Articles
All Articles
ASP.NET Articles
Related Web Technologies
User Tips!
Coding Tips

Sample Chapters
JavaScript Tutorials
MSDN Communities Hub
Official Docs
Stump the SQL Guru!
XML Info
Author an Article
Print this page.
User Tips: Highlighting a DataGrid Row When Mousing Over

By Mark Mailer

I recently read Scott Mitchell's article Creating a Row-Selectable DataGrid Control, which details how to create a custom DataGrid server control whose rows' background colors change when moused over and whose rows can be selected by clicking anywhere in the row. (You can see a live demo of Scott's control here.)

Rather than use Scott's custom control, I wanted a quick and easy way to add row-level highlighting when mousing over a particular DataGrid in a particular ASP.NET page. My solution was to directly add onmouseover and onmouseout attributes to the DataGrid's items in the ItemDataBound event handler. My code is used in an intranet, IE-only setting and has worked well. While not as robust as Scott's approach, it can be quickly and easily implemented.

Anyway, the code for the DataGrid's ItemDataBound event handler is provided below:

Private Sub DataGridID_ItemDataBound(ByVal sender As Object, ByVal e As System.Web.UI.WebControls.DataGridItemEventArgs) Handles DataGridID.ItemDataBound

    If e.Item.ItemType = ListItemType.Item OrElse e.Item.ItemType = ListItemType.AlternatingItem Then

        ' Do the mouseover and mouseout javascript
        Dim oBGcolour As String

        If e.Item.ItemType = ListItemType.Item Then
            oBGcolour = Right(Hex(DataGridID.ItemStyle.BackColor.ToArgb()), 6)
        ElseIf e.Item.ItemType = ListItemType.AlternatingItem Then
            oBGcolour = Right(Hex(DataGridID.AlternatingItemStyle.BackColor.ToArgb()), 6)
        End If

        e.Item.Attributes.Add("onmouseover", "this.style.background='#cdcdcd';")
        e.Item.Attributes.Add("onmouseout", "this.style.background='#" & oBGcolour & "';")

    End If

End Sub

Happy Programming!

  • By Mark Mailer

    Return to user tips...

  • ASP.NET [1.x] [2.0] | ASPFAQs.com | Advertise | Feedback | Author an Article