MouseOver for DataGrid Row
Messages   Related Types
This message was discovered on ASPFriends.com 'aspngdatagridrepeaterdatalist' list.


=?iso-8859-1?q?Bruce=20Maginnis?=
Does anyone know if it possible to provide a rollover
for a entire Datagrid Row, i.e. OnMouseOver the entire
row/<TR> changes to red and then OnMouseOut changes
back to original colour.

If you have implemented anything like it, can I please
see some code?

Thanks,
Bruce

__________________________________________________
Do You Yahoo!?
Everything you'll ever need on one web page
from News and Sport to Email and Music Charts
http://uk.my.yahoo.com

Reply to this message...
 
    
Alex Lowe
Bruce,

Something like this works:

Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs) Handles
DataGrid1.ItemDataBound
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
e.Item.Attributes.Add("onMouseOver", "this.bgColor='#006600'")
e.Item.Attributes.Add("onMouseOut", "this.bgColor='#FFFFFF'")
End If
End Sub

There are two key points to be made in this code:
1) e.Item represents the current row (or Item) being bound inside the
DataGrid. Remember, the DataGrid renders as a table in HTML and e.Item
is the <TR> tag or row.
2) Almost all server controls (HTML and Web) have an attributes
collection which allows you to add elements such as the onMouseOver
element.

Hth,

Alex - AspFriends.com Moderation Team
Microsoft MVP - ASP.NET

***********************************************************
Translate C# code to VB.NET code at
http://aspalliance.com/aldotnet/examples/translate.aspx
***********************************************************

[Original message clipped]

| = JOIN/QUIT

Reply to this message...
 
    
=?iso-8859-1?q?Bruce=20Maginnis?=
Dear List,

Thanks for your help before.

I was wondering if you could help me a wee bit more.

I'm not entirely sure how to make the entire row in
the datagrid respond to a click event and highlight a
particular colour, to let me know the row has been
clicked or selected.

I have tried a few ways but keep hitting a brick wall.

Also, I'm using a CSS for the form and I can't seem to
get the Attributes for Item etc etc to overwrite the
CSS onMouseOver/Out.

Thanks,
Bruce

--- Alex Lowe <Click here to reveal e-mail address> wrote:
[Original message clipped]

__________________________________________________
Do You Yahoo!?
Everything you'll ever need on one web page
from News and Sport to Email and Music Charts
http://uk.my.yahoo.com

Reply to this message...
 
    
Alex Lowe
Bruce,

Basically, to use the client-side click event is just about the same as
using the onMouseOver or onMouseOut event. Have you tried code like
this:

Something like this works:

Private Sub DataGrid1_ItemDataBound(ByVal sender As Object, ByVal e As
System.Web.UI.WebControls.DataGridItemEventArgs) Handles
DataGrid1.ItemDataBound
If e.Item.ItemType = ListItemType.Item Or e.Item.ItemType =
ListItemType.AlternatingItem Then
e.Item.Attributes.Add("onClick", "this.bgColor='#006600'")
End If
End Sub

You could also emit some more complicated Javascript in place of or with
the background color changing code above.

As far as CSS goes, I don't understand what you are trying to do. Why
are you trying to get the attributes for Item to overwrite the CSS
onMouseOver/Out? Why can't you just remove those two items from your
stylesheet?

Alex - AspFriends.com Moderation Team
Microsoft MVP - ASP.NET

***********************************************************
Translate C# code to VB.NET code at
http://aspalliance.com/aldotnet/examples/translate.aspx
***********************************************************

[Original message clipped]

| = JOIN/QUIT

Reply to this message...
 
    
=?iso-8859-1?q?Bruce=20Maginnis?=
Alex,

What I am trying to do is have the whole row/item
mouse clickable.

So that the every row can be clicked anywhere to then
indicate that it has been selected.

I'm not sure how to achieve this, its kinda like
placing the each row/item within an <a href but I
don't know how to do this using the DataGrid specifics

So when the row is clicked, the row becomes red and
lets me know I have selected it for editing.

Anyone have any ideas?

Thanks,
Bruce

__________________________________________________
Do You Yahoo!?
Everything you'll ever need on one web page
from News and Sport to Email and Music Charts
http://uk.my.yahoo.com

Reply to this message...
 
 
System.Web.UI.WebControls.DataGrid
System.Web.UI.WebControls.DataGridItemEventArgs
System.Web.UI.WebControls.ListItemType
System.Windows.Forms.DataGrid




Ad
MBR BootFX
Best-of-breed application framework for .NET projects, developed by Matthew Baxter-Reynolds and MBR IT
 
 Copyright © Matthew Baxter-Reynolds 2001-2008. '.NET 247 Software Development Services' is a trading style of MBR IT Solutions Ltd.
Contact Us - Terms of Use - Privacy Policy - www.dotnet247.com