How to add rollover effect to a ButtonField in a GridView?

[Rob Roberts]

I am trying to figure out a way to add onmouseover and onmouseout events to
ButtonFields in a GridView in order to give them a rollover effect, but so
far I haven't been able to figure out a way to do it. Does anyone know how
to do this?

Thanks in advance,
--Rob Roberts

 

[armand.widiatmo]

Hi Rob,
To put rollover image, that means you need to have 2 images.
one for mouse over and one for mouse out.
Here is what you need to do:
-Assuming that you have place the image inside the gridview,
on the vb file, inside the RowDataBound method, you need to declare a
variable as Image.
-Then use find control to assign that variable to Image ID. for
example:
Dim lnkDelete As Image = e.Row.FindControl("Delete")
-After that, add java script attributes to the variable that you
declared. For example:
If Not lnkDelete Is Nothing Then
lnkDelete.Attributes.Add("onMouseOver", "this.src =
'images/delete_hoover.gif';")
lnkDelete.Attributes.Add("onMouseOut", "this.src =
'images/delete.gif';")
End If

I hope this helps, let me know if you have questions.

Happy programming

 

[Rob Roberts]

Thank you for your reply. However, I'm afraid I don't quite understand it.

When adding a rollover effect to a regular ASP.NET button, I do it by adding
onmouseover and onmouseout events to the button's Attributes collection,
like this (in C#):

MyButton.Attributes.Add("onmouseover", "this.className='actionH'");
MyButton.Attributes.Add("onmouseout", "this.className='actionN'");

That works fine for regular ASP.NET buttons, but GridView ButtonFields don't
seem to have an Attributes collection, so I don't see any way to add the
onmouseover and onmouseout events to them.

--Rob Roberts